vue基础扩展4---$parent属性

最新推荐文章于 2023-01-20 19:37:12 发布

VIP文章野生技术协会

最新推荐文章于 2023-01-20 19:37:12 发布

阅读量550

点赞数

分类专栏： vue

本文链接：https://blog.csdn.net/shuixiou1/article/details/112689633

版权

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
  <title>vue基础扩展4---$parent属性</title>
</head>
<body>
  <div id="app">
    {
  {msg}}
    <my-child ></my-child>
  </div>

  <script>
    // 概述：在父子层级组件中，当某组件挂载时，可以通过$mount函数内，通过$parent
    // 找到它挂载到的父组件，并且还可以通过$children找到挂载到它身上的子组件

    // 1、案例演示
    // 说明：先挂载子组件MyChild，它的$parent是MyChild,它的子组件是MyChildA和MyChildB，再挂载
    // el为#app的vm实例，它没有父节点了，它的子节点是MyChild。
    let vm = new Vue({
      el: '#app',
      data: {
        msg: 'root'
      },
      mounted () {
        console.log("父组件挂载")
        console.log(this.$parent, '父') // 没有父组件
        console.log(this.$children, '子') // MyChild
      },
      components: {
        'MyChild': {
          template: `<div>{
  {msg}}<my-chil

最低0.47元/天解锁文章

野生技术协会

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
3
评论
vue基础扩展4---$parent属性

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> <title>vue基础扩展4---$parent属性</title></head><body> <div id="app"> {{msg}} <my-child ></my-child> </div> <s.
复制链接

扫一扫