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 hot重新加载东西，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将始终为空。这就是为什么你可能想要使用计算属性，或者观察属性。

无法为数据分配道具

1 个答案: