Vue，实现组件属性的双向绑定方式

prop 是单向绑定的：当父组件的属性变化时，将传导给子组件，但是不会反过来

A 中 调用 B 这个组件 A表示的就是父组件 B表示的就是子组件 如果父组件的值发生了变化，将会传导给子组件，但是子组件中发生了变化，由于原来子组件的数据已经展示出来，再次修改则无法直接显示数据修改

解决的办法如下

在子组件的内部
Vue.component("switchbtn", {
    template: "<div @click='change'>{{myResult?'开':'关'}}</div>",
    props: ["result"], // 存贮父组件传过来的值
    data: function () {
        return {
            myResult: this.result // 在data中我们重新声明一个值来存放 父组件传递过来的值
        };
    },
    // 给父组件传过来的值  props: ["result"], result 进行监听
    watch: { 
        result(val) {
            this.myResult = val;//新增result的watch，监听变更并同步到myResult上
        }
    },

参考链接：https://www.cnblogs.com/xxcanghai/p/6124699.html?_t=t