vue设置默认首页的操作
在router.js设置如下:
index就是默认页面
const routes = [ // 公司项目 { path: '/', redirect: '/index' }, {path:'/index',component:index}, { path:'/example', component:example, redirect:'/edetail', children:[ {path:'/edetail',component:edetail} ] }, {path:'/login',component:login} ]
不使用在根目录设置router的方法,跳转页面带不同的头部信息时容易出现问题
补充知识:vue-router默认的首页渲染设置
当一个vue项目的页面打开,总得有一个默认的首页组件自动出现
不能只是点击首页的跳转才出现
这个默认的打开路由配置需要在router.js中的 VueRouter 实例中,改变routes数组
const router = new VueRouter({ routes:[ { path:'/', //redirect 是重新定向 redirect:'/home' }, { path:'/home', component:Home } ] })
这样设置之后,就将默认的路由路径设置为/home
以上这篇vue设置默认首页的操作就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们。
相关推荐
-
在vue中实现给每个页面顶部设置title
实现思路很简单:就是利用路由的导购守卫beforeEach在每次页面跳转前更改对应的title 1.首先在route里面给每个路由加上meta属性 2.在main.js里面加上导航守卫 router.beforeEach((to,form,next) => { window.document.title = to.meta.title == undefined?'默认标题':to.meta.title next() }) 补充知识:vue element tab标签页文本溢出时,鼠标上去 Too
-
解决vue单页面应用中动态修改title问题
详细信息查看:vue-weachat-title 解决问题: 1.Vuejs 单页应用在iOS系统下部分APP的webview中 标题不能通过 document.title = xxx 的方式修改 该插件只为解决该问题而生(兼容安卓) 2.在vue单页面中,通过浏览器分享到QQ.微信等应用中的链接,只有一个首页标题和默认icon图片 已测试:APP 微信 QQ 支付宝 淘宝 安装 npm install vue-wechat-title --save 用法 1.在main.js中引入 impor
-
vue设置一开始进入的页面教程
vue项目默认进入的页面是 HelloWorld.vue 现在我们创建一个页面Login.vue <template> <div> 登录界面 </div> </template> <script type="text/ecmascript-6"> export default { data() { return {} } } </script> 在router目录下的index.js文件中我们设置一开始进入的页面
-
vue项目初始化到登录login页面的示例
如下所示: export default new Router({ routes: [ { path: '/', redirect:'/login', }, { path: '/login', alias:'/accounts/login', name: '登录', component: () => import('@/views/accounts/login') } ] `` 嗯 就这样写就可以啦 我向来都是简单粗暴~~ 以上这篇vue项目初始化到登录login页面的示例就是小编分享给大家的全
-
vue设置默认首页的操作
在router.js设置如下: index就是默认页面 const routes = [ // 公司项目 { path: '/', redirect: '/index' }, {path:'/index',component:index}, { path:'/example', component:example, redirect:'/edetail', children:[ {path:'/edetail',component:edetail} ] }, {path:'/login',com
-
Vue设置长时间未操作登录自动到期返回登录页
Vue设置长时间未操作登录以后自动到期返回登录页 首先我们写在main.js文件中 import routerUtil from "@/utils/routerutil";//先将js文件在main.js中引入 routerUtil(router); 我们会在登陆成功后调用sessionUtil文件中的setSession,sessionUtil下面写的有 import sessionUtil from '@/utils/sessionutil' sessionUtil.setSess
-
Apache中如何设置默认首页具体该怎么操作
在你安装后的Apache目录下,有一个conf目录,在这个目录里,有一个"httpd.conf"文件.我们要做的,就是修改这个文件. 在这个文件里,凡是以"#"开头的每一行,都是无效的,如果你想让你的设置起作用,就要把行首的"#"去掉. 找到 DirectoryIndex 这段.把它改成DirectoryIndex index.php index.Html index.html 这样,你的网站目录的默认首页是 index.php, 如果没有ind
-
@RequestParam使用defaultValue属性设置默认值的操作
@RequestParam使用defaultValue属性设置默认值 注意设置必须是string类型的,框架自己会做转换 @RequestParam(value = "page", required = false, defaultValue = "1") Integer page, @RequestParam(value = "size", required = false) Integer size, 补充:@RequestParam注解的使
-
Spring Boot 2.0 设置网站默认首页的实现代码
Spring Boot设置默认首页,方法实验OK如下 附上Application启动代码 /** * @ClassName Application * @Description Spring-Boot website启动类 * @author kevin.tian * @Date 2018-03 * @version 1.0.0 */ @SpringBootApplication @PropertySource(value={ "file:${APP_HOME_CONF}/overpayment
-
Vue props中Object和Array设置默认值操作
我就废话不多说,看代码吧~ seller: { type: Object, default() { return {} } } seller: { type: Object, default: function () { return {} } } 当父组件没有传这个值或者值是空时,输出的话,返回: 下面这种是错误的 seller: { type: Object, default: () => {} } 当父组件没有传这个值或者值是空时,输出的话,这时是返回underfind,在template
-
Vue 设置axios请求格式为form-data的操作步骤
Cover 在Vue中使用axios 这个老生常谈了,还是先记录一遍,方面后面自己查. !!! 设置form-data请求格式直接翻到后面看. 1. 安装axios 在项目下执行npm install axios. 之后在main.js中,添加: import axios from 'axios' //引入 //Vue.use(axios) axios不能用use 只能修改原型链 Vue.prototype.$axios = axios 2. 发送GET请求 axios封装了get方法,传入请求
-
Vue.js 实现地址管理页面思路详解(地址添加、编辑、删除和设置默认地址)
1.前阶段做了这个地址管理页面,实现的过程中遇到了很多的问题,好在最后实现了,在此记录一下: 首先是加载页面阶段ajax从数据库中获取数据,然后动态的显示在页面中,随后可以点击单个的编辑或删除进行相关操作,可以单击默认地址按钮进行样式切换,默认地址可以没有(单击选中和取消),但是如果设置默认地址则只能设置一个,好,下面我们来一步一步的实现. 2.我这里使用的是Vue.js,页面加载阶段很简单,直接在mounted声明一个方法,然后在方法中调用ajax请求访问数据然后通过v-for循环将数据放入到
-
基于vue.js仿淘宝收货地址并设置默认地址的案例分析
这个案例主要是渲染地址列表,然后设置默认地址,与淘宝的收货地址功能一样,具体自行查看自己的淘宝收货地址: 效果图: html结构 <!--the-address--> <div class="the-address"> <div class="adr-tent" id="vue-address"> <table class="adr-table"> <thead class
-
IIS6、IIS7.5设置网站默认首页方法(Directory Listing Denied)
今天有个客户问我他的网址访问目录就打开网站出现Directory Listing Denied,其实就是没有设置默认页面的问题,一般情况下默认网页的名称都是index.html,index.htm,default.htm,default.html.index.php.default.php等等,一般不是index就是default,不是html就是htm,其实这个默认页面名称可以随意设置,123.htm都是可以的,只要你设置一下就可以了. 1.目录中如果没有默认页面的或者iis中设置的默认页面不
随机推荐
- android中使用Activity实现监听手指上下左右滑动
- SQL server 2008不允许保存更改的完美解决办法(图解)
- 多功能jQuery树插件zTree实现权限列表简单实例
- 48个英语音标表-附一个flash实现的音标的读音
- asp.net中的check与uncheck关键字用法解析
- JS简单实现表格排序功能示例
- JS实现消息来时让网页标题闪动效果的方法
- JavaScript初学者建议:不要去管浏览器兼容
- MySQL 4G内存服务器配置优化
- 整理关于Bootstrap表单的慕课笔记
- javascript 四十条常用技巧大全
- VBS教程:函数-Log 函数
- 如何在Linux上安装Node.js
- c#加密类使用方法示例
- php文件夹与文件目录操作函数介绍
- Android编程实现TextView垂直自动滚动功能【附demo源码下载】
- Android滑动优化高仿QQ6.0侧滑菜单(滑动优化)
- Vue2.0用户权限控制解决方案的示例
- 虚拟机Linux桥接模式下设置静态IP详解
- Redis如何实现数据库读写分离详解