关于vue.js:P16-vue-父子组件访问方式-refs

45次阅读

共计 601 个字符，预计需要花费 2 分钟才能阅读完成。

Hello_kugou.vue

<template>
  <div>
    <!-- 组件是能够复用 -->
    <Hello_kugou :message="msg" static='56' :list="list" ref="hellokugou"></Hello_kugou>
    <!-- 父子组件拜访形式 , 父组件拜访子组件 $refs $children- 数组类型（vue2）-->
    <!-- 子组件拜访父组件 $parent-->
    <!-- 子组件拜访跟组件 $root-->
    <p ref="p"></p>




  </div>
</template>

<script>
import Hello_kugou from "./Hello_kugou.vue";
export default {data(){// 让每一个组件对象都返回一个对象，不对数据净化
    return{
      msg: 'hellokugoumsg',
      list: [1,2,3]
    };
  },
  components:{Hello_kugou},
  methods:{
    // 在子组件理  $emit 触发事件
    sendParent:function (){//this.$emit('事件名称', '发送的事件参数')
      this.$emit('injectMsg', this.msg)
    }
  },
  mounted() {console.log(this.$refs);
  },
  name: "Content"
}
</script>

<style scoped>

</style>

正文完