Javascript 在Vue中将数据从子级传递到子级

所以。。在我的应用程序中，在

认证

一章中，我有一些问题

首先，我有多个组件/路由，其中两个是

register

和

login

Register

工作正常，使用我的api，作为响应，我得到一个

username

和

account\u id

，两者都存储在数据库中

---

当尝试

登录时

，在响应中我得到

用户名

和

令牌

。。现在，当我访问我的网站中只有你登录才能访问的其他路由时，我需要检测是否存在令牌。如何使其成为具有

token

值且其他组件可以轻松访问的全局变量？

将令牌存储在cookie/localstorage中，如果使用vuex，也可以将其存储在状态中

如果您使用Axios或任何其他工具处理ajax请求，您可以在头中传递您的令牌，然后从cookie/localstorage中拾取它

state: {
   token: Cookie.getJSON('token') || null,
},
mutations: {
  setToken: (state, data) => {
    state.token = data
    Cookie.set('token', data)
  }
},
actions: {
  setToken (context, data) {
    context.commit('setToken', data.token)
  }
}

---

选中此选项-

您好。这个问题对于StackOverflow标准来说太广泛了，因为通常会出现一个非常具体的代码示例问题。如何处理它取决于您的设置-您使用的是Vue路由器还是VueX？等等。在较高级别上，您需要将令牌存储在Vuex存储中（如果有），或者作为全局变量。然后，在每次路由转换之前，您必须使用来检查有效令牌。您可能还需要传递您的令牌以及您可能需要发出的任何其他API请求。但是，使用哪一个更好？Cookies还是Vuex？主要区别是什么？饼干很容易使用，那么还有什么不够呢？Vuex也是这样吗？我使用cookies（以防用户刷新页面）和vuex商店（在我的SPA中使用）。我把代码放在上面的答案里。哦，看起来很简单，也很有用。谢谢你的回复。但我想确保你的代码很好，对吗？我的意思是，这种结合两者的方式提供了良好的稳定性，我不应该在开发网站的过程中遇到问题是吗？我在一个网站coversingers.com上工作，我使用了相同的代码。只需确保当您注销用户时，取消设置状态并删除cookie即可。