vue 实例的生命周期

桃扇骨 2023-01-08 04:22 321阅读 0赞 
  1. <body>
  2.   <div id="app">
  3.     <div>{
  4.    {msg}}</div>
  5.     <button @click='update'>更新</button>
  6.     <button @click='destroy'>销毁</button>
  7.   </div>
  8.   <script type="text/javascript" src="js/vue.js"></script>
  9.   <script type="text/javascript"> var vm = new Vue({ el: '#app', data: { msg: '生命周期' }, methods: { update: function(){ this.msg = 'hello'; }, destroy: function(){ this.$destroy(); } }, beforeCreate: function(){ console.log('beforeCreate'); }, created: function(){ console.log('created'); }, beforeMount: function(){ console.log('beforeMount'); }, mounted: function(){ console.log('mounted'); }, beforeUpdate: function(){ console.log('beforeUpdate'); }, updated: function(){ console.log('updated'); }, beforeDestroy: function(){ console.log('beforeDestroy'); }, destroyed: function(){ console.log('destroyed'); } }); </script>
  10. </body>

发表评论

表情：
评论列表 （有 0 条评论，321人围观）

还没有评论，来说两句吧...

相关阅读

    相关 VUE 实例的生命周期

    什么是VUE生命周期 从Vue实例创建、运行、到销毁期间，总是伴随着各种各样的事件，这些事件，统称为生命周期！ vue把整个生命周期划分为 创建 、更新、挂载、销毁 等

    亦凉亦凉/ 0 赞/ 158 阅读

    相关 Vue 实例生命周期

    一、生命周期 Vue 应用都是通过 [Vue 实例][Vue]（ViewModel）完成的，Vue 创建实例需要一系列的初始化动作，需要设置数据监听、编译模板、将实例挂载

    Bertha 。Bertha 。/ 0 赞/ 598 阅读

    相关 Vue实例生命周期

    实例生命周期 实例生命周期钩子 生命周期图示 实例生命周期钩子   每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、

    川长思鸟来川长思鸟来/ 0 赞/ 522 阅读