从品牌网站建设到网络营销策划,从策略到执行的一站式服务
vuejs设置title的操作方法,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。
创新互联建站主要从事网站设计、做网站、网页设计、企业做网站、公司建网站等业务。立足成都服务合山,10年网站建设经验,价格优惠、服务专业,欢迎来电咨询建站服务:13518219792
vuejs设置title的方法:1、通过npm install安装“vue-wechat-title”;2、在main.js中引入“vue-wechat-title”;3、在index.js中给每个路由添加title即可。
本文操作环境:windows7系统、Vue2.9.6版、Dell G3电脑。
vuejs怎么设置title?
vue单页面标题设置 title
前端框架如
Vue、React
等都是单页面的应用,整个web站点其实是一个index页面,页面跳转都是替换index.html里边的内容。这与传统的每个页面设置title标签的做法不一样。
推荐使用 vue-wechat-title
Vuejs 单页应用在iOS系统下部分APP的webview中 标题不能通过 document.title = xxx 的方式修改 该插件只为解决该问题而生(兼容安卓)
已测试APP
微信
QQ
支付宝
淘宝
npm install vue-wechat-title --save
main.js
中引入import VueWechatTitle from 'vue-wechat-title'Vue.use(VueWechatTitle)
index.js
中给每个路由添加 title
// 挂载路由const router = new Router({ mode: 'history', routes:[ { path: '/', name: 'Index', component: Index, meta: { title: '首页' // 标题设置 } }, { path: '/lists', name: 'Lists', component: Lists, meta: { title: '列表' // 标题设置 } } ] });
app.vue
中修改 router-view
组件自定义加载的图片地址 默认是 ./favicon.ico 可以是相对或者绝对的
ok !重启看看
看完上述内容是否对您有帮助呢?如果还想对相关知识有进一步的了解或阅读更多相关文章,请关注创新互联行业资讯频道,感谢您对创新互联的支持。
成都网站建设公司地址:成都市青羊区太升南路288号锦天国际A座10层 建设咨询028-86922220
成都快上网科技有限公司-四川网站建设设计公司 | 蜀ICP备19037934号 Copyright 2020,ALL Rights Reserved cdkjz.cn | 成都网站建设 | © Copyright 2020版权所有.
专家团队为您提供成都网站建设,成都网站设计,成都品牌网站设计,成都营销型网站制作等服务,成都建网站就找快上网! | 成都网站建设哪家好? | 网站建设地图