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

Question

我在Laravel8中使用vue3和惯性Js

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

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

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

Answer 1

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

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

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

在这个 Vue 文档中了解更多信息

Answer 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>

您可以在v0.4.0 的更改日志中找到更多信息。

Answer 3

在“inertia-vue3”中，我们如何知道“描述”发生了变化？

import { Head } from '@inertiajs/inertia-vue3'

<Head>
  <title>About - My app</title>
  <meta head-key="description" name="description" content="This is a page specific description" />
</Head>

在视图源中，什么都无法理解！

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">


        
        
        <title inertia>test</title>
        

    <body>   
    </body>
</html>

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

问题描述

3 个解决方案

解决方案1
1 2021-06-03 07:12:42

解决方案2
0 已采纳 2021-06-29 18:54:04

解决方案3
0

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

问题描述

3 个解决方案

解决方案1 1 2021-06-03 07:12:42

解决方案2 0 已采纳 2021-06-29 18:54:04

解决方案3 0

解决方案1
1 2021-06-03 07:12:42

解决方案2
0 已采纳 2021-06-29 18:54:04

解决方案3
0