当前位置:首页 > 开发 > 互联网 > 正文

vue简单使用

发表于: 2016-06-05   作者:super-d2   来源:转载   浏览:
摘要: // {{todo.text}} X  参考:http://www.runoob.com/w3cnote/vue-js-quickstart.htmlvue+webpack:https://segmentfault.com/a/1190000004690338http://guowenfh.github.io
<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <meta name="robots" content="noindex, nofollow">
  <meta name="googlebot" content="noindex, nofollow">
  <style type="text/css">
  </style>
  <title></title>
<script type='text/javascript'>//<![CDATA[
window.onload=function(){
new Vue({
  el: '#app',
  data: {
    newTodo: '',
    todos: [
      { text: 'Add some todos' }
    ]
  },
  methods: {
    addTodo: function () {
      var text = this.newTodo.trim()
      if (text) {
        this.todos.push({ text: text })
        this.newTodo = ''
      }
    },
    removeTodo: function (index) {
      this.todos.splice(index, 1)
    }
  }
})
}//]]> 
</script>
</head>
<body>
  <script src="https://cdn.jsdelivr.net/vue/latest/vue.js"></script>
<div id="app">
  <input v-model="newTodo" v-on:keyup.enter="addTodo">
  <ul>
    <li v-for="todo in todos">
      <span>{{ todo.text }}</span>
      <button v-on:click="removeTodo($index)">X</button>
    </li>
  </ul>
</div>
</body>
</html>

 参考:

http://www.runoob.com/w3cnote/vue-js-quickstart.html

vue+webpack:

https://segmentfault.com/a/1190000004690338

http://guowenfh.github.io/2016/03/24/vue-webpack-02-deploy/

https://segmentfault.com/a/1190000005363030

vue简单使用

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
transition 与 v-for 一起用时可以创建渐近过渡。给过渡元素添加一个特性 stagger,enter-stagger 或
先看Modal.vue代码 <template> <div draggable="true" class="modal" v-bind:style="{ 'wi
vueJS的源码解读 vue源码总共包含约一万行代码量(包括注释)特别感谢作者Evan You开放的源代码,访
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
转自:http://my.oschina.net/u/1026531/blog/188336 一、先创建一张mongo表,右击已创建的数据库te
众所周知最近几年前端发展非常的迅猛,除各种框架如:backbone、angular、reactjs外,还有模块化开
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号