vue 中 兄弟组件怎么传递参数

在 Vue 中，兄弟组件之间可以通过父组件作为中介来传递参数。具体做法如下：

1. 在父组件中定义一个数据属性，用于存储需要传递的参数。

2. 将该数据属性作为 props 传递给需要传递参数的兄弟组件。

3. 在兄弟组件中通过 props 接收该参数。

4. 当需要修改参数时，调用父组件中的方法来修改该数据属性。

5. 父组件会自动将修改后的参数传递给所有子组件，包括兄弟组件。

示例代码：

<!-- 父组件 -->
<template>
  <div>
    <child1 :param="param" @updateParam="updateParam"></child1>
    <child2 :param="param"></child2>
  </div>
</template>

<script>
export default {
  data() {
    return {
      param: 'xxx',
    };
  },
  methods: {
    updateParam(newParam) {
      this.param = newParam;
    },
  },
};
</script>

<!-- 兄弟组件1 -->
<template>
  <div>
    <button @click="updateParam('yyy')">修改参数</button>
  </div>
</template>

<script>
export default {
  props: ['param'],
  methods: {
    updateParam(newParam) {
      this.$emit('updateParam', newParam);
    },
  },
};
</script>

<!-- 兄弟组件2 -->
<template>
  <div>{{ param }}</div>
</template>

<script>
export default {
  props: ['param'],
};
</script>