使用VueJS 3 Composition API完成变异后的查询

wbrvyc0a  于 2022-12-14  发布在  Vue.js
关注(0)|答案(1)|浏览(151)

我对vue和整个主题都很陌生,但我的目标是在保存jwt令牌后运行myUser查询。
JWT保存正在工作,但是我不知道在变异完成后如何继续。我在考虑登录ref上的watch(),但是我不确定。尝试了几种方法,但是没有找到解决方案,并且由于www中信息的缺乏,我希望你能帮助我。
这是我的核心逻辑

<script>
    import gql from 'graphql-tag';
    import { useMutation, useQuery } from '@vue/apollo-composable';
    import { ref, computed, watch } from 'vue';
    import { useUserStore } from '../stores/user';
    import { myUser } from '@/apollo/queries';
    import { loginUser } from '@/apollo/mutations';
    
    export default {
       name: 'LoginForm',
    
       setup() {
          let username = ref('');
          let password = ref('');
          let loggedIn = ref(false);
    
          const error = computed(() => {
             return username.value === '' ? 'The username is required' : '';
          });
    
          const {
             mutate: loginUserMutation,
             onDone,
             onError,
          } = useMutation(loginUser);
    
          onDone((res) => {
             if (
                res?.data?.loginUser && res.data.loginUser.success
             ) {
                localStorage.setItem('access-token', res.data.loginUser.msg);
    
                useUserStore().$patch({
                   username: res.data.loginUser.msg,
                });
    
                loggedIn.value = true;

>>>>>>>>>>> Now with the JWT token, call myUser query <<<<<<<<<<
             }
          });
    
          const loginBtnClicked = () => {
             loginUserMutation({
                username: username.value,
                password: password.value,
                platform: 'PC',
             });
          };
    
          return {
             username,
             password,
             error,
             loginBtnClicked,
             loginUserMutation,
          };
       },
    };
    </script>
bihw5rsg

bihw5rsg1#

不如...
创建函数const myUser() => { -> myuser query logic... }
localStorage.setItem('access-token', res.data.loginUser.msg);之后调用myUser函数

相关问题