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

Vue Extends 擴(kuò)展選項(xiàng)用法完整實(shí)例

 更新時(shí)間：2019年09月17日 09:07:25   作者：Json____  
這篇文章主要介紹了Vue Extends 擴(kuò)展選項(xiàng)用法,結(jié)合完整實(shí)例形式分析了Vue Extends 擴(kuò)展選項(xiàng)相關(guān)使用技巧與操作注意事項(xiàng),需要的朋友可以參考下

本文實(shí)例講述了Vue Extends 擴(kuò)展選項(xiàng)用法。分享給大家供大家參考，具體如下：

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Vue Extends 擴(kuò)展選項(xiàng)</title>
  <script type="text/javascript" src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
</head>
<body>
<h1>Vue Extends 擴(kuò)展選項(xiàng)</h1>
<hr>
<div id="app">
  <p>
    {{num}}
  </p>
  <p><button @click="add">add</button></p>
</div>
</body>
</html>
<script>
  var extendObj={
   updated:function () {
     console.log('我是擴(kuò)展的Update')
   },
   methods:{
     //如果方法名一樣 他只觸發(fā)構(gòu)造器里的方法 擴(kuò)展不觸發(fā) 混入選項(xiàng)也一樣
     add:function(){
       this.num++
       console.log('我是擴(kuò)展出來(lái)的方法')
     }
   }
  };
  var app = new Vue({
    el:'#app',
    data:{
      num:1
    },
    updated:function(){
      console.log('我是構(gòu)造器觸發(fā)的')
    },
    methods:{
      add:function(){
        this.num++
        console.log('我是原生的方法')
      }
    },
    //擴(kuò)展不能為數(shù)組 混入是為數(shù)組
    extends:extendObj
  })
</script>

運(yùn)行結(jié)果：

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

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

相關(guān)文章

最新評(píng)論