首页 > 解决方案 > 通过事件总线 -Vue js 呈现的项目

问题描述

<template>
  <div>
    <h1>This is a data page</h1>
    <p v-for="data in dummyData" :key="data.id">{{ data.title }}</p>
  </div>
</template>

<script>
import { eventBus } from '../main'

export default {
  name: "Data",
  data() {
    return {
      dummyData: [
        {
          id: 1,
          title: "Dummy Data One",
          completed: false
        },
        {
          id: 2,
          title: "Dummy Data Two",
          completed: false
        },
        {
          id: 3,
          title: "Dummy Data Three",
          completed: false
        },
      ]
    }
  },

  created() {
    eventBus.$on('pass-todo', (**obj**) => {
      var parsedobj = JSON.parse(JSON.stringify(obj))
      console.log(parsedobj)
    })
  }
}
</script>

如何通过 evenBus 将来自另一个组件的对象传递给模板,以便我可以渲染它?更具体地说,我实际上想将即将到来的对象添加到 dummyData 并渲染它!

标签: vue.js

解决方案


推荐阅读