vue之如何配置默认显示页面和默认路由

更新时间：2023年06月29日 08:39:01 作者：咬紧牙关i

这篇文章主要介绍了vue之如何配置默认显示页面和默认路由问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教

vue配置默认显示页面和默认路由

在router文件夹中的index.js中配置

const routes = [
    {
        //没写就是任意路由都是定向这个
        path:'',
        //重定向
        redirect:'/xxx'
    }
]

vue中的路由以及默认路由跳转

参考网站：Vue Router 。

vue路由配置：

方法一

1、安装

npm install vue-router  --save   / cnpm install vue-router  --save

2、引入并 Vue.use(VueRouter) (main.js)

import VueRouter from 'vue-router'
Vue.use(VueRouter)

3、创建组件

4、配置路由

5、实例化VueRouter 注意：名字

6、挂载

整个main.js

7、根组件的模板里面放上这句话 <router-view></router-view>

8、路由跳转

方法二

1、在main.js中引用

2、在router文件夹中的index.js中配置路由

3、app.vue中添加路由占位符

总结

以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:

Vue3使用withDefaults和defineProps设置默认值的操作指南
文章详细比较了Vue3中使用defineProps和withDefaults设置props默认值的优缺点,defineProps简洁但代码臃肿,withDefaults分离定义与默认值设置,提高可读性,且默认值不会丢失,但代码分散,适用于复杂组件和动态生成默认值,促进代码复用和维护,需要的朋友可以参考下
2026-05-05
vue button的@click方法无效钩子函数没有执行问题
这篇文章主要介绍了vue button的@click方法无效钩子函数没有执行问题及解决，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2022-03-03
Vue.js点击切换按钮改变内容的实例讲解
今天小编就为大家分享一篇Vue.js点击切换按钮改变内容的实例讲解，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
2018-08-08
VUE脚手架具体使用方法
这篇文章主要介绍了VUE脚手架具体使用方法，vue-cli这个构建工具大大降低了webpack的使用难度，小编觉得不错，下面就一起来了解一下具体使用方法
2019-05-05
Vue基于iview实现登录密码的显示与隐藏功能
这篇文章主要介绍了Vue基于iview实现登录密码的显示与隐藏功能,本文通过截图实例代码说明给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
2020-03-03
Vue warn:Property "state" was accessed during
这篇文章主要为大家介绍了Vue warn:Property "state" was accessed during render的报错解决，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-06-06
Vue.js样式动态绑定实现小结
这篇文章主要介绍了Vue.js样式动态绑定实现小结，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2019-01-01
vue3中的ref、reactive问题解析
ref 和 reactive都是vue3推出的针对组合式设计的声明响应式状态的API,两者在使用之前都要先进行引入,本文通过实例代码详解vue3中的ref、reactive问题,感兴趣的朋友一起看看吧
2024-03-03
Vue中使用setTimeout问题
这篇文章主要介绍了Vue中使用setTimeout问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2023-01-01
vue3页面加载完成后如何获取宽度、高度
这篇文章主要介绍了vue3页面加载完成后如何获取宽度、高度问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
2023-04-04