0
点赞
收藏
分享

微信扫一扫

vue2生命周期

逸省 2022-04-30 阅读 147

在这里插入图片描述

<div id="app">
  <div class="demo">{{ msg }}</div>
</div>

<script>
  new Vue({
    el: '#app',
    data: {
      msg: 'ok'
    },
    methods: {
      show() {
        console.log('show')
      }
    },
    // 此时只有Events和生命周期函数初始化完毕
    beforeCreate() {
      // console.log(this.msg) // undefined
    },
    // 访问data中的属性和methods中方法最早只能在created中访问
    created() {
      // console.log(this.msg) // ok
      // console.log(document.querySelector('.demo').innerHTML) // {{ msg }}
    },
    beforeMount() {
      console.log(document.querySelector('.demo').innerHTML) // {{ msg }}
    },
    mounted() {
      console.log(document.querySelector('.demo').outerHTML) // <div class="demo">ok</div>
    }
  })
  </script>
举报

相关推荐

0 条评论