vue wechat title

memengaruhi

Untuk aplikasi satu halaman Vuejs, judul di tampilan web beberapa Aplikasi di sistem iOS tidak dapat diubah melalui document.title = xxx. Plugin ini hanya dibuat untuk mengatasi masalah ini (kompatibel dengan Android)

APLIKASI yang diuji

• Wechat wechat
• QQ
• Alipay
• Taobao

Efek (silakan gunakan APLIKASI apa pun dalam daftar di atas untuk memindai kode guna membuka pengalaman)

Metode penggunaan versi yang berbeda serupa tetapi efeknya sama. Demo ini ditulis oleh Vuejs1.x

Buka langsung: http://vue-wechat-title.deboy.cn/

Memasang

Vuejs 1.x

npm install [email protected] --save

Vuejs 2.x

npm install vue-wechat-title --save

penggunaan

Demo Vuejs 1.x

Demo Vuejs 2.x

ES6

main.js

 Vue . use ( require ( 'vue-wechat-title' ) )

Definisi rute (hanya mencegat sebagian saja)

 // ...
const routes = [
  {
    name : 'Home' ,
    path : '/home' ,
    meta : {
      title : '首页'
    } ,
    component : require ( '../views/Home.vue' )
  } ,
  {
    name : 'Order' ,
    path : '/order' ,
    meta : {
      title : '订单'
    } ,
    component : require ( '../views/Order.vue' )
  } ,
  {
    name : 'UCenter' ,
    path : '/ucenter' ,
    meta : {
      title : '用户中心'
    } ,
    component : require ( '../views/UCenter.vue' )
  }
]
// ...

App.vue merekomendasikan untuk menggunakannya secara global hanya sekali. Judul arahan dapat ditentukan di vuex atau router.

 <!-- 任意元素中加 v-wechat-title 指令 建议将标题放在 route 对应meta对象的定义中 -->
< div v-wechat-title =" $route.meta.title " > </ div >
<!--or-->
< router-view v-wechat-title =" $route.meta.title " > </ router-view >

Sesuaikan alamat gambar yang dimuat. Defaultnya adalah alamat gambar base64 yang kosong. Perlu diperhatikan bahwa alamat tersebut harus diteruskan jika Anda ingin menggunakannya di Aplikasi Alipay. /favicon.ico

 < div v-wechat-title =" $route.meta.title " img-set =" /static/logo.png " > </ div >

Selamat mengirimkan PR