Question

我想知道如何在NuxtJs中将某些字符串或动态数据从父级传递到子级

我如何尝试但不起作用：

这是我的父组件：

<template>
  <div>
     <ChildComponent :someData="Some String" />
  </div>
</template>

<script>

import ChildComponent from "~/components/childComponent.vue";

export default {
 components: {
    ChildComponent,
  },
}
</script>

这是我的ChildComponent

<template>

  <div>
    {{someData}}
  </div>

</template>

<script>

export default {
 name:"ChildComponent",
 props: {
   someData: String
 }
}
</script>

并且此方法在ChildComponent中没有呈现

Answer 1

如果您直接传递值，即不需要分号，则不必绑定。

<ChildComponent someData="Some String" />

仅在传递数据时才需要绑定。

<template>
  <div>
     <ChildComponent :someData="localData" />
  </div>
</template>

<script>

import ChildComponent from "~/components/childComponent.vue";

export default {
 components: {
    ChildComponent,
  },
  data(){
    return {
      localData: "Some String"
    }
  }
}
</script>

如何在NuxtJS中将数据从父级传递到子级

1 个答案: