vue created mounted

作者：洃铯哖輪发布日期:2025-03-03 浏览:160

new Vue({
  el: '#app',
  data() {
    return {
      message: 'Hello Vue!'
    }
  },
  created() {
    // 在 created 生命周期钩子中，实例已经完成了数据观测 (data observation)，
    // 属性和方法的运算，watch/event 事件回调。然而，挂载阶段还没开始，
    // $el 属性目前不可见。
    console.log('created: ', this.$el); // 输出 null
    console.log('created: Data is observed and computed properties are set up.');
  },
  mounted() {
    // 在 mounted 生命周期钩子中，实例已完成挂载，$el 已被替换为真实的 DOM 元素，
    // 并且可以访问到挂载后的 DOM 结构。
    console.log('mounted: ', this.$el); // 输出真实的 DOM 元素
    console.log('mounted: The instance has been fully mounted and can access the DOM.');
  }
});

<div id="app">
  {{ message }}
</div>

上一篇：vue数组排序

下一篇：vue h()