小编nay*_*iba的帖子

使用 JWT 的 API 请求在 Flask 和 Vue.js 中实现。JWT 存储在 cookie 中，服务器为每个请求验证 JWT。

如果令牌已过期，将返回 401 错误。如果您收到 401 错误，请按照以下代码刷新令牌，再次发出原始 API 请求。以下代码适用于所有请求。

http.interceptors.response.use((response) => {
    return response;
}, error => {
    if (error.config && error.response && error.response.status === 401 && !error.config._retry) {
        error.config._retry = true;
        http
            .post(
                "/token/refresh",
                {},
                {
                    withCredentials: true,
                    headers: {
                        "X-CSRF-TOKEN": Vue.$cookies.get("csrf_refresh_token")
                    }
                }
            )
            .then(res => {
                if (res.status == 200) {
                    const config = error.config;
                    config.headers["X-CSRF-TOKEN"] = Vue.$cookies.get("csrf_access_token");
                    return Axios.request(error.config);
                }
            })
            .catch(error => {

            }); …

我想使用 Vue.js v-for 将点击事件分配给 v-list-item。这是代码：

<v-list-item-group>
  <v-list-item v-for="(item, index) in items" :key="index" @click="item.action">
    <v-list-item-icon>
      <v-icon dark color="#7E6990" v-text="item.icon"></v-icon>
    </v-list-item-icon>
    <v-list-item-title>{{ item.title }}</v-list-item-title>
  </v-list-item>
</v-list-item-group>


<script>
export default {
  data: () => ({
    items: [
      {
        title: "title1",
        icon: "mdi-play-box-multiple",
        action: "logout"
      },
      { title: "title2", 
        icon: "mdi-logout", 
        action: "logout" }
    ]
  }),
  methods: {
    logout() {
        alert('logout!');
    },
  }
}
</script>

我想将项目的操作分配给@click。以下将正确工作。

<v-list-item-group class="user-menu">
  <v-list-item v-for="(item, index) in items" :key="index" @click="logout">
    <v-list-item-icon>
      <v-icon dark color="#7E6990" v-text="item.icon"></v-icon>
    </v-list-item-icon>
    <v-list-item-title>{{ item.title }}</v-list-item-title> …