vue單頁面應用中動態修改title

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: '個人' },
    },
  ]}
)

以後在各個組建中隨便一個標籤中均可寫入

<div v-wechat-title="$route.meta.title"></div>
or/
<router-view v-wechat-title="$route.meta.title"></router-view>

想要動態的改變title值，能夠這樣寫

<div v-wechat-title="$route.meta.title={data.title}"></div>