首页  >  问答  >  正文

在组合式 Vue3 中使用 useRoute

我有一个文件 store/service.js,我想使用路由器。

我做这个:

import { useRoute } from 'vue-router';
const router = useRoute();
function exceptionHandler(error) {
  if (error.response.status === 401) {
    router.push('/user/login');
  } else if (error.response.status === 404) {
    throw new Error(error.response.data.Message || error.message);
  } else {
    router.push('/error');
  }
}

但在路由器使用中收到未定义错误。

注意:这不是setup标签内的,这是一个js外部文件

P粉937382230P粉937382230346 天前812

全部回复(1)我来回复

  • P粉982054449

    P粉9820544492023-11-23 10:42:44

    useRoute() 只能在设置内部使用,因此请尝试将函数编写为像这样的可组合项

    import { useRoute } from 'vue-router';
    
    export function useExceptionHandler(){
    
    const router = useRoute();
    
    function exceptionHandler(error) {
      if (error.response.status === 401) {
        router.push('/user/login');
      } else if (error.response.status === 404) {
        throw new Error(error.response.data.Message || error.message);
      } else {
        router.push('/error');
      }
    }
        return {
            exceptionHandler,
        }
    }
    

    你可以在你的组件上像这样使用它

    <script setup>
    
    const { exceptionHandler } = useExceptionHandler();
    
    </script>
    

    回复
    0
  • 取消回复