vue如何在一个组件中给另一个组件添加东西

Vue中可以使用props和$emit来实现组件之间的通信，让一个组件向另一个组件添加东西。具体实现方法如下：

1. 通过props向另一个组件传递数据

在父组件中，用v-bind指令将数据绑定到子组件的props上：

<template>
<div>
<child-component :data="myData"></child-component>
</div>
</template>

<script>
export default {
data() {
return {
myData: '这是父组件的数据'
}
}
}
</script>

在子组件中，定义props，并在模板中使用该数据即可：

<template>
<div>{{ data }}</div>
</template>

<script>
export default {
props: ['data']
}
</script>

2. 通过$emit在子组件中触发父组件的事件

在子组件中，通过$emit方法触发父组件的事件：

<template>
<button @click="addData">添加数据</button>
</template>

<script>
export default {
methods: {
addData() {
this.$emit('add', '这是子组件添加的数据')
}
}
}
</script>

在父组件中，定义add方法并在子组件中使用$emit触发该方法：

<template>
<div>
<child-component @add="addData"></child-component>
</div>
</template>

<script>
export default {
data() {
return {
myData: '这是父组件的数据'
}
},
methods: {
addData(data) {
this.myData += ' ' + data
}
}
}
</script>

通过以上两种方式，就可以在一个组件中向另一个组件添加东西了。