0
私のアプリケーションを開発する際に、サイト内のすべての要素のルートであるラッパー（この例では簡略化）がありました。しかし、このラッパーの横にカスタムプロパティを持つコンポーネントを含める必要がありました。私は、そのコンポーネントのプロパティが読み込まれなかっされなかったことを発見したときにそれはです。ルート要素のVuejsカスタムプロパティ
index.htmlを
<body>
<div id="app" > <!-- Vuejs is bound to this element -->
<test-item testProp="My Test Prop Outside Wrapper"></test-item>
<wrapper></wrapper>
</div>
</body>
TestItem.vue
<template>
<h1>{{ testProp }}</h1>
</template>
<script>
export default {
props: {
testProp: {
type: String,
default: "Default String"
}
}
}
</script>
Wrapper.vue
<template>
<div>
<test-item testProp="My Test Prop Inside Wrapper"></test-item>
</div>
</template>
<script>
export default {
}
</script>
Vue.component('test-item', require('./components/TestItem.vue'));
Vue.component('wrapper', require('./components/Wrapper.vue'));
const app = new Vue({
el: '#app'
});
：私は、これらのコンポーネントをインポートして、Vueのインスタンスを初期化参考
しかし、これは私が見ているものではなく、ラッパーの外側のもので、プロパティが渡されず、デフォルトのプロパティ値が使用されます。
<h1>Default String</h1>
<div>
<h1>My Test Prop Inside Wrapper</h1>
</div>
何が起こっているのですか？
小道具は、ケバブの場合https://vuejs.org/v2/guide/components.html#camelCaseで記述する必要があります-vs-kebab-case コンポーネントの属性は 'test-prop =" valueここに "' –
@BelminBedakどうすれば気づかなかったのか分かりません。どうもありがとうございました。コメントの代わりにこれを答えとして貼り付けることはできますか？ –