我使用 localStorage.setItem('token', jwt);，来存放jwt令牌，怎么在前端用代码实现每次请求，请求头冲都带上jwt令牌,整体的代码和请求要怎么写，分别放在那些文件里

要在前端的每次请求中携带JWT令牌，可以在请求头中设置Authorization字段来携带，具体代码实现如下：

1. 在发送请求前先从localStorage中获取JWT令牌：

const token = localStorage.getItem('token');

2. 在发送请求时，在请求头中设置Authorization字段携带JWT令牌：

axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;

3. 完整的代码实现如下：

在包含发送请求的文件中，例如src/api/index.js中：

import axios from 'axios';

// 从localStorage中获取JWT令牌
const token = localStorage.getItem('token');

// 设置请求头
axios.defaults.headers.common['Authorization'] = `Bearer ${token}`;

// 发送请求
export function getUserInfo() {
  return axios.get('/api/user/info');
}

export function updateUserProfile(data) {
  return axios.put('/api/user/profile', data);
}

在main.js中引入axios：

import axios from 'axios';

Vue.prototype.$axios = axios;

在需要发送请求的组件中，例如src/views/UserProfile.vue中：

<template>
  <div>
    <form @submit.prevent="updateProfile">
      <input v-model="username" type="text">
      <button type="submit">提交</button>
    </form>
  </div>
</template>

<script>
import { updateUserProfile } from '@/api/index';

export default {
  data() {
    return {
      username: '',
    };
  },
  methods: {
    async updateProfile() {
      try {
        await updateUserProfile({ username: this.username });
        // 更新成功
      } catch (error) {
        // 更新失败
      }
    },
  },
};
</script>

这样，在每次发送请求时，都会自动携带JWT令牌。