vue 案例(三)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Vue 案例(三)</title>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="div-top">
  <ol>
    <li v-for="n in listName">
      {{ n.name }}
    </li>
  </ol>
   <button v-on:click="open()">增加 1</button>
</div>

<script>
new Vue({
  el: '#div-top',
  data: {
    listName: [
      { name: 'zhangSan' },
      { name: 'LiSi' },
      { name: 'WangMaZi' }
    ]
  },
 methods: {
    open: function () {
      alert('Hello ')
    }
  }
})
</script>
</body>
</html>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章