Question

请帮助，我目前正在学习反应，在创建博客应用程序时遇到了某种问题。

我彼此嵌套了组件，但是除非刷新了嵌套组件的页面，否则子组件中不会接收到更新的数据。下面是我的代码段。AccountOverview组件中是处理表单的另一个组件（容器）。表单提交数据并由后端处理数据后，我希望AccountOverview组件将呈现新信息。但是，如果我然后返回到父级（仪表板）并进行编辑，则AccountOverview组件不会显示新创建的数据，除非刷新整个页面。

<template>
    <main v-html="obj.html || 'loading... (1)'">
    </main>
</template>

<script>
export default {
    name: 'Post',

    data: function () {
        return {
            obj: {
                html: 'loading... (2)'
            }
        }
    },

    created: async function () {
        this.obj = await this.getObject()
        this.obj.html = await this.getHtml()
        console.log(this.obj.html)
    },

    methods: {
        getObject: async function () {
            const resp = await this.$http.get('https://jsonplaceholder.typicode.com/todos')
            return resp.body[0]
        },
        getHtml: async function () {
            const resp = await this.$http.get('https://jsonplaceholder.typicode.com/todos')
            return resp.body[0].title
        },
    }
}
</script>

Answer 1

您的提交动作是否导致您的组件卸下。我尝试克隆您的代码。似乎错过了密钥文件，因此无法运行

React +中的嵌套子组件+渲染新数据

1 个答案: