父子拜访 children $refs

  • 父组件拜访子组件：应用$children或$refs reference（援用）

    <body>  <div id="app">      <cpn></cpn>      <cpn></cpn>      <cpn ref="aaa"></cpn>      <button @click="btnClick">按钮</button>  </div><template id="cpn">  <div>      我是子组件  </div></template><script>  var app = new Vue({      el: '#app',      methods: {          btnClick() {              console.log(this.$children)              this.$children[0].showMessage() //拿到子组件，调用子组件办法              console.log(this.$refs.aaa.name)//对象类型，默认是一个空的对象，须要在组件加上 ref=""          }      },      components: {          cpn: {              template: '#cpn',              data() {                  return {                      name: '我是子组件的name'                  }              },              methods: {                  showMessage() {                      console.log('showMessage')                  }              }          }      }  })</script>