Vue3调用Django REST Framework遇401错误，仅刷新后可正常请求

嵌入主Vue页面的组件，点击菜单展示组件页面时，调用接口会返回401错误；只有刷新整个页面后，才能正常获取数据。目前通过在mounted钩子中加入页面刷新逻辑临时解决问题，但无法定位401的根源。

Vue3 组件代码 #

mounted() {
  this.getUserInfo();
},
methods: {
  getUserInfo() {
    const token = localStorage.getItem("token");
    axios
      .get("/api/v2/user_info/", {
        headers: { Authorization: `Bearer ${token}` },
      })
      .then((response) => {
        this.users = response.data;
      })
      .catch((error) => {
        console.log(error);
      });
  },

Django Views.py 代码 #

class User_Info_List(generics.ListCreateAPIView):
    queryset = User_Info.objects.all()
    serializer_class = User_InfoSerializer

临时解决方法（页面刷新） #

mounted: function () {
  if (location.href.indexOf("#reloaded") == -1) {
    location.href = location.href + "#reloaded";
    location.reload();
  }
}

内容的提问来源于stack exchange，提问作者Vance