Question

我有一个vue应用程序和一个推送路由器并将数据传递到另一个路由器组件的功能。

 passData: function () {
            EventBus.$emit('passName', this.tableRow[0]);
            this.$router.push('/analytic-two');
        }

然后是另一个组件。

<template>
    <p>
        This is Data passed from chart component {{passedRow}}
    </p>
</template>

<script>

import { EventBus } from '../event-bus.js';

export default {
    data() {

        return {
            passedRow: [
                {
                    "name": "",
                    "numSongs": "",
                    "Year": ""
                }
            ],
            name: '',
            id: '?',

        };
    },
    created: function () {
        const self = this; 
        EventBus.$on('passName', function (value) {
            self.passedRow = value;
            console.log(self.passedRow);

        });
    },
}

</script>

我知道数据正在传输并且正在记录但是我无法弄清楚如何在我的模板中显示它是否有人有任何想法。

Answer 1

我建议不要使用＆＃34; =＆＃34;操作符而不是清除反应阵列，然后用新值填充它

self.passedRow.splice('deleteCount');
self.passedRow.push(...value);   //pushes all the values in the value-array

这样你至少可以看到进展。您还可以在设置新值后强制执行DOM-Update，但在这种情况下这不太可能。为此，请在组件this.$forceUpdate()

中调用

Vue：无法显示使用事件总线传递组件传递信息中的数据

1 个答案: