如何在元信息中使用 Vue 变量?

0 javascript syntax vue.js vue-meta

脚本中这一行 Vue 的正确语法是什么:

export default {
metaInfo: {
      title: "{product.name} wallpaper",
Run Code Online (Sandbox Code Playgroud)

这条线变成了这样:

title: "Space wallpaper",
Run Code Online (Sandbox Code Playgroud)

product.name 我在 api 中得到它:

mounted() 
{ 
let vm = this
vm.getProducts(); 

},
methods: {
getProducts() {
                let vm = this
                axios.get('/api/products')
                    .then(function(response) {
                        vm.products = response.data.data  
                    })
Run Code Online (Sandbox Code Playgroud)

Del*_*lan 5

模板文字在大括号前使用反引号和美元符号,例如:

title: `${product.name} wallpaper`
Run Code Online (Sandbox Code Playgroud)

要将反应变量metaInfo用作函数的一部分,Vue Meta 文档说您可以创建metaInfo一个函数并将反应变量分配给局部变量,然后再返回数据。例如:

metaInfo() {
      const product = this.product;
      return {
          title: `${product.name} wallpaper`
      }
}
Run Code Online (Sandbox Code Playgroud)

Vue Meta 的一位贡献者在这里解释了为什么你需要这样做。