将道具从 parent 传递到 child 组件时出错

Question

所以我在将 prop 从我的 parent 视图传递到另一个视图时遇到问题，现在我只是在使用一个简单的变量进行测试，但它似乎没有接受它。 ..没有任何错误或任何错误，它只是没有显示在我的页面上。

这是我的 parent 代码：

<template>
  <v-app>
    <Navbar v-bind:currency="currency"/>
    <v-content class="mx-5 my-5" v-bind:currency="currency">
      <router-view></router-view>
    </v-content>

  </v-app>
</template>

<script>
import Navbar from '@/components/Navbar'

export default {
  name: 'App',
  components: {
    Navbar
  },
  data() {
    return {
      currency: "$ test"
    }
  },
};
</script>

这是我的 child 元素中的代码片段：

export default {
  name: "Home",
  props: ['currency']
}

以及我使用货币的地方：

<div class="text-center green--text font-weight-bold headline">{{ currency }}</div>

任何人都可以看出我做错了什么为什么这个元素没有被拾取吗？

亲切的问候，乔希

Answer 1

它应该可以正常工作，我没有发现任何问题：Here's 一个简单的工作复制品。检查它以确保没有差异。

将道具从 parent 传递到 child 组件时出错

Error with passing a prop from parent to child component

javascript

vue.js

vue-props