Vue 组件传值方法5，利用$parent和$Children

实现思想：
利用每个组件的属性来传值，即每个组件都有 $parents和$Children等属性，根据这些属性找到要找的组件，对其进行操作，
比如Vue实例vm的父级没有，子组件在这里有App和App下的Son，这些都是vm的属性中报错，换句话说vm下面的每一行代码都能在vm的某个属性中找到，对其进行更改，
便可达到从父组件向子组件传值的效果，换言之，从子组件向父组件‘传值’也可以这样。
理论上来说这种方式可以实现任意组件之间‘传值’，只要通过某种关系找到某组件，就可以对其进行任何操作，包括传值

let Son = {
        template:`<div>
            {{ name }} {{ position }}<button @click="ChangeName">Change Parent Name</button>
        </div>`,
        data(){
            return{
                name:'Son',
                position:'son'
            }
        },
        methods:{
            ChangeName(){
                this.$parent.name = 'Have Change';//设置父级的name为xxx
            }
        }
    };
    let App = {
        template: `<div id="app">
        {{ name }}
        {{ position }}
        <button @click="send">Pass Value</button>
        <hr><Son/>
        </div>`,
        data(){
            return{
                name:"App",
                age:21,
                position:'parent',
                message:'From App'
            }
        },
        components:{
            Son
        },
        methods:{
            send(){
                this.$children[0].name = "change";//设置它的第一个子元素，即子组件的name为 xxx
            }
        }
    };