无法将道具分配给数据

Question

这是一个简单的组件。我正在尝试将 props 分配给 data，正如 docs 所说的那样。（initialData 来自 vuex 和数据库）

<template>
    <section>
        {{ initialData }}
        {{ privateData }}
    </section>
</template>

<script>
export default {
    name: 'someName',
    props: [
        'initialData'
    ],
    data() {
        return {
            privateData: this.initialData
        };
    }
 };

但是，问题是 initialData 是可以的，但是 privateData 只是一个空对象 {}。

最奇怪的是，如果我再次保存我的文件，那么 webpack 热重新加载东西，privateData 也会得到我需要的正确数据。

这是父级：

<template>
    <section v-if="initialData">
        <child :initial-data="initialData"></micro-movies>
    </section>
</template>

<script>
export default {
    name: 'parentName',
    data() {
        return {};
    },
    computed: {
        initialData() {
            return this.$store.state.initialData;
        }
    },
    components: {
        child
    }
};
</script>

我知道这是关于动态获取数据的。因为如果我手动将父对象中的 initialData 更改为某个对象，它就可以正常工作。

Answer 1

数据函数仅在组件创建时被调用一次。如果 initialData 在该时间点未填充，则 privateData 将始终为空。这就是为什么您可能想要使用计算属性或观看属性.

无法将道具分配给数据

can not assign props to data

vue.js

vuejs2

vue-directives