兄弟组件可以通过父组件进行数据中转

    兄弟组件传值 - 图1

    兄弟组件传值 - 图2

    兄弟组件传值 - 图3

    兄弟组件传值 - 图4

    <!DOCTYPE html> <html lang=“en”> <head> <meta charset=“UTF-8”> <meta name=“viewport” content=“width=device-width, initial-scale=1.0”> <title>Document</title> </head> <body> <div id=“app”> <com-a @value-change=“value = $event” ></com-a> <com-b :value=“value” ></com-b> </div> <script src=“lib/vue.js”></script> <script> // 子组件A：发送数据 Vue.component(‘ComA’, { template: `
    组件A的内容： {{ value }} @click=”$emit(‘value-change’, value)” >发送
    `, data () { return { value: ‘这是组件A中的数据’ } } }); // 子组件B：接收数据 Vue.component(‘ComB’, { props: [‘value’], template: `
    组件B接收到： {{ value }}
    ` }); // 根实例（父组件） new Vue({ el: ‘#app’, data: { // 用于数据中转 value: ‘’ } }) </script> </body> </html>