uniapp如何全局使用page-meta
时间: 2023-12-23 12:02:29 浏览: 471
uniapp-抓娃娃-营销工具
在uni-app中,可以通过在App.vue中使用onLaunch方法,设置页面的meta信息。具体步骤如下:
1. 在App.vue中的onLaunch方法中使用uni.setStorageSync方法,将meta信息存储到本地存储中。
```javascript
onLaunch: function() {
uni.setStorageSync('meta', {
title: 'uni-app全局meta',
keywords: 'uni-app, meta',
description: 'uni-app中如何全局使用meta'
})
}
```
2. 在需要使用meta信息的页面中,使用onLoad方法获取本地存储中的meta信息,并将其赋值到页面的meta属性上。
```javascript
onLoad: function() {
let meta = uni.getStorageSync('meta')
if (meta) {
this.$page.meta = meta
}
}
```
3. 在页面中使用uni-page-meta组件来设置页面的meta信息。
```html
<template>
<view>
<uni-page-meta :title="meta.title" :keywords="meta.keywords" :description="meta.description"></uni-page-meta>
<view>这是一个使用全局meta信息的页面</view>
</view>
</template>
<script>
export default {
data() {
return {
meta: {}
}
},
onLoad: function() {
let meta = uni.getStorageSync('meta')
if (meta) {
this.$page.meta = meta
}
}
}
</script>
```
通过上面的步骤,就可以在uni-app中实现全局使用page-meta了。
阅读全文