W3Cschool
恭喜您成為首批注冊(cè)用戶
獲得88經(jīng)驗(yàn)值獎(jiǎng)勵(lì)
Nuxt.js 使用了 vue-meta 更新應(yīng)用的 頭部標(biāo)簽(Head) 和 html 屬性。
使用 head 方法設(shè)置當(dāng)前頁面的頭部標(biāo)簽。
在 head 方法里可通過 this 關(guān)鍵字來獲取組件的數(shù)據(jù),你可以利用頁面組件的數(shù)據(jù)來設(shè)置個(gè)性化的 meta 標(biāo)簽。
<template>
<h1>{{ title }}</h1>
</template>
<script>
export default {
data () {
return {
title: 'Hello World!'
}
},
head () {
return {
title: this.title,
meta: [
{ hid: 'description', name: 'description', content: 'My custom description' }
]
}
}
}
</script>
注意:為了避免子組件中的meta標(biāo)簽不能正確覆蓋父組件中相同的標(biāo)簽而產(chǎn)生重復(fù)的現(xiàn)象,建議利用 hid 鍵為meta標(biāo)簽配一個(gè)唯一的標(biāo)識(shí)編號(hào)。
Copyright©2021 w3cschool編程獅|閩ICP備15016281號(hào)-3|閩公網(wǎng)安備35020302033924號(hào)
違法和不良信息舉報(bào)電話:173-0602-2364|舉報(bào)郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號(hào)
聯(lián)系方式:
更多建議: