nuxt3 传值给layout

在 Nuxt.js 3 中，你可以通过使用 `context` 对象来将值传递给布局（layout）。以下是一种常见的方法：

1. 在页面组件中，你可以通过 `setup` 函数来访问 `context` 对象，并将需要传递给布局的值设置为 `context.root.$data` 的属性。例如：

<script>
export default {
  setup() {
    const myValue = 'Hello from page'
    const context = useContext()
    context.root.$data.myValue = myValue
  }
}
</script>

2. 在布局组件中，你可以通过 `setup` 函数来访问 `context` 对象，并使用 `$data` 属性来获取页面传递的值。例如：

<template>
  <div>
    <h1>Layout</h1>
    <p>{{ myValue }}</p>
    <Nuxt />
  </div>
</template>

<script>
export default {
  setup() {
    const context = useContext()
    const myValue = context.root.$data.myValue
    return { myValue }
  }
}
</script>

这样，你就可以在页面组件和布局组件之间传递值了。请注意，这只是一种简单的示例，你可以根据自己的需求进行调整和扩展。