资讯专栏INFORMATION COLUMN

vue单页面应用中动态修改title

evin2016 / 662人阅读

摘要:适用于微信各大浏览器首先执行命令用法之后在全局入口处,引入然后在路由中首页活动项目服务空间发现我的之后在各个组建中随便一个标签中都可写入想要动态的改变值,可以这样写

vue-weachat-title

======================================

适用于

1.微信
2.webview
3.各大浏览器
--------

demo: http://www.yahoo.com/

首先执行命令

vue2.x用法
npm install vue-wechat-title;

之后在main.js全局入口处,引入wechat-title

Vue.use(require("vue-wechat-title"));

然后在router路由中

export default new Router({
  routes: [
    {
      path: "/",
      redirect: "index",
    },
    {
      path: "/index",
      name: "Index",
      component: Index,
      meta: { title: "首页" },
    },
    {
      path: "/project",
      name: "Project",
      component: Project,
      meta: { title: "活动项目" },
    },
    {
      path: "/service",
      name: "Service",
      component: Service,
      meta: { title: "服务" },
    },
    {
      path: "/interspace",
      name: "Interspace",
      component: Interspace,
      meta: { title: "空间" },
    },
    {
      path: "/discover",
      name: "Discover",
      component: Discover,
      meta: { title: "发现" },
    },
    {
      path: "/my",
      name: "My",
      component: My,
      meta: { title: "我的" },
    },
  ]}
)

之后在各个组建中随便一个标签中都可写入

or/

想要动态的改变title值,可以这样写

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/92162.html

相关文章

  • 使用Vue快速开发应用vue-router

    摘要:当前路由对象调用此函数处理切换过程的下一步终止切换重定向到另一个路由由于是路由切换后,只有上面的两个属性。原文地址其他使用快速开发单页应用主体结构使用快速开发单页应用使用快速开发单页应用登录页面使用快速开发单页应用功能组件与路由组件通信 本文所涉及代码全在vue-cnode vue-router主要作用是将路由控制,转移到前端。我们将会在vue-router里面保存一个路由表,在vue...

    mingde 评论0 收藏0
  • 前端框架_Vue

    摘要:如果没有文件,则读取文件夹下的或者。如果都都找不到,抛出错误。 JS表达式 函数(方法)调用表达式 test() //函数调用表达式 属性调用表达式 var obj = {name:wt}; var arr = [123,bai]; obj.name //属性调用表达式 arr[0] //属性调用表达式 变量(常量)调用表达式 let name = wutao; name ...

    qieangel2013 评论0 收藏0
  • Nuxt.js 基础入门教程

    摘要:原文链接开发一个单页面应用,相信很多前端工程师都已经学会了,但是单页面应用有一个致命的缺点,就是极不友好。基于它,我们可以快速开发一个基于的单页面应用。只有数据流存在相关配置时可用。引入后,所有页面均有效。 原文链接 Vue 开发一个单页面应用,相信很多前端工程师都已经学会了,但是单页面应用有一个致命的缺点,就是 SEO 极不友好。除非,vue 能在服务端渲染(ssr)并直接返回已经渲...

    yedf 评论0 收藏0
  • 处理 Vue 页面 SEO 的另一种思路

    摘要:官方地址设置单页面信息,如果需要单页面,可以和形成更优的配合单页面应用在前端正大放光彩。随着单页面应用的普及,人们在感受其带来的完美的用户体验,极强的开发效率的同时,也似乎不可避免的要去处理的需求。 vue-meta-info 官方地址: https://github.com/monkeyWang... (设置vue 单页面meta info信息,如果需要单页面SEO,可以和 prer...

    shiweifu 评论0 收藏0

发表评论

0条评论

evin2016

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<