欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

vue生命周期與鉤子函數(shù)簡單示例

 更新時(shí)間：2019年03月13日 08:43:45   作者：白楊-M  
這篇文章主要介紹了vue生命周期與鉤子函數(shù),結(jié)合簡單實(shí)例形式分析了vue.js生命周期及鉤子函數(shù)相關(guān)流程與實(shí)現(xiàn)技巧,需要的朋友可以參考下

本文實(shí)例講述了vue生命周期與鉤子函數(shù)。分享給大家供大家參考，具體如下：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>www.dbjr.com.cn vue生命周期與鉤子函數(shù)</title>
  <style>
  </style>
  <script src="https://cdn.bootcss.com/vue/2.4.4/vue.min.js"></script>
</head>
<body>
  <div id="box">
    {{msg}}
  </div>
  <script>
    var vm=new Vue({
      el:'#box',
      data:{
        msg:'well'
      },
      created:function(){
        alert('實(shí)例已經(jīng)創(chuàng)建');
      },
      beforeCompile:function(){
        alert('編譯之前');
      },
      compiled:function(){
        alert('編譯之后');
      },
      ready:function(){
        alert('插入到文檔中');
      },
      beforeDestroy:function(){
        alert('銷毀之前');
      },
      destroyed:function(){
        alert('銷毀之后');
      }
    });
    /*點(diǎn)擊頁面銷毀vue對象*/
    document.onclick=function(){
      vm.$destroy();
    };
  </script>
</body>
</html>

網(wǎng)上找來一張流程圖：

感興趣的朋友可以使用在線HTML/CSS/JavaScript代碼運(yùn)行工具：http://tools.jb51.net/code/HtmlJsRun測試上述代碼運(yùn)行效果。

希望本文所述對大家vue.js程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評論