如何在惯性js和vue3中设置和更改（页面标题）

Posted 2023-03-16

【中文标题】如何在惯性js和vue3中设置和更改（页面标题）

【英文标题】：How to set and change ( title of page ) in inertiajs and vue3

【发布时间】：2021-08-17 07:52:46

【问题描述】：

我将 vue3 和 inertiaJs 与 Laravel8

一起使用

如果我更改页面，我想更改（页面标题）

我在 Inertia 文档中检查了这段代码，但它对我不起作用，并且页面标题没有改变 我安装了 vue-meta

  metaInfo() 
     return() 
         title: “Home Page”,
     
  

【参考方案1】：

return() 是一个属性，而不是一个函数。 :) 所以你应该这样做：return

// parent
metaInfo: 
  meta: [
    vmid: 'description',
    name: 'description',
    content: 'my standard description',
  ]


// child
metaInfo() 
  return 
    meta: [
      vmid: 'description',
      name: 'description',
      content: this.description,
    ]
  
,

通过this Vue doc了解更多信息

【参考方案2】：

根据 Inertia v0.4.0，他们现在捆绑了自己的 inertia-head 组件，您可以使用它来添加元标记和更新标题。不再需要vue-meta。

只需将以下内容直接添加到您的页面组件中：

<inertia-head>
  <title>Your page title</title>
  <meta name="description" content="Your page description">
</inertia-head>

您可以在change logs of v0.4.0找到更多信息。