Vue js - 在同一级别的两个组件内传递数据 [英] Vue js - pass data within two components in the same level

问题描述

我有数据需要从一个 component1 传递到另一个 component2.

I have data that I need to pass from one component1 to another component2.

我不使用 vuex 或 router.

组件树:

-Parent
--Component1
--Component2

从第一个 component1 我发出 ajax 请求，检索信息并推送到数据.

From first component1 I make ajax request, retrieving info and pushing to data.

board: [1,2,3,4,5]

而且我需要访问 component2

我可以不用 vuex 或 router 吗?

Can I do It without vuex or router ?

谢谢:)

推荐答案

您可以从 component1 向父级发出事件，并将更新后的 board 作为参数并在父级中一个接收并通过 props 传递给 component2

You could emit an event to parent from component1 having as parameters the updated board and in the parent one receive that and pass it through props to component2

在 component1 中:

this.$emit("sendToComp2",this.board);

在 parent 组件中:

  <template>
  <component1  @sendToComp2="sendTo2"/>
  ...
  <component2 :boards="boards" />
  ....
  </template>


  data:{
    boards:[]
    },
  methods:{
       sendTo2(boards){
        this.boards=boards
          }
      }

component2 应该有名为 boards

  props:["boards"]

这篇关于Vue js - 在同一级别的两个组件内传递数据的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！