<!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) {
      )
    }
  }
})
}//]]>
</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简单使用的更多相关文章

  1. Vue简单基础 + 实例 及 组件通信

    vue的双向绑定原理:Object.defineProperty() vue实现数据双向绑定主要是:采用数据劫持结合发布者-订阅者模式的方式,通过 Object.defineProperty() 来劫 ...

  2. vue简单实现

    vue简单实现 vue的三个核心 虚拟dom, 双向绑定 Proxy,

  3. html vue简单

    1.Vue 简单的替换更新 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  4. 一篇文章带你了解网页框架——Vue简单入门

    一篇文章带你了解网页框架--Vue简单入门 这篇文章将会介绍我们前端入门级别的框架--Vue的简单使用 如果你以后想从事后端程序员,又想要稍微了解前端框架知识,那么这篇文章或许可以给你带来帮助 温馨提 ...

  5. vue初学实践之路——vue简单日历组件(1)

    ---恢复内容开始--- 最近做的项目有一个需求,需要有一个日历组件供预定功能使用,之前的代码过于繁琐复杂,所以我采用vue重写了这个组件. npm.vue等等安装. 只是一个简单的日历组件,所以并不 ...

  6. 极速搭建RTMP直播流服务器+webapp (vue) 简单实现直播效果

    在尝试使用webRTC实现webapp直播失败后,转移思路开始另外寻找可行的解决方案.在网页上尝试使用webRTC实现视频的直播与看直播,在谷歌浏览器以及safari浏览器上测试是可行的.但是基于基座 ...

  7. vue（2）—— vue简单语法运用，常用指令集

    按照前面的文章:vue(1)——node.js安装使用,利用npm安装vue  安装完vue之后,就可以使用vue了 vue vue简介 前面安装好vue之后,确实还没有对vue进行介绍,首先,官网: ...

  8. vue简单介绍

    最近在逛各大网站,论坛,以及像SegmentFault等编程问答社区,发现Vue.js异常火爆,重复性的提问和内容也很多,楼主自己也趁着这个大前端的热潮,着手学习了一段时间的Vue.js,目前用它正在 ...

  9. vue简单demo

    为了学习基础语法,我并没有用vue-cli脚手架来vue init [基于什么类型]  [项目名称]初始化项目,而是直接<script>../vue.js</script> & ...

  10. parcel vue 简单使用

    1.安装依赖 yarn global add parcel-bundler yarn add babel-preset-env --dev yarn add parcel-plugin-vue --d ...

随机推荐

  1. JVM专题目录

    1.Java虚拟机及运行时数据区 2.JVM内存垃圾回收方法 3.JVM内存分配策略 4.HotSpot JVM常用参数设置

  2. RabbitMQ学习系列（五）: RPC 远程过程调用

    前面讲过一些RabbitMQ的安装和用法,也说了说RabbitMQ在一般的业务场景下如何使用.不知道的可以看我前面的博客,http://www.cnblogs.com/zhangweizhong/ca ...

  3. Java基础：三目运算符

    三目运算符 (表达式1)?(表达式2):(表达式3),计算方法是这样的:表达式1是一个逻辑表达式,如果其值为true,则整个表达式的值为表达式2的值,否则为表达式3的值.

  4. Money， save or spend， this is a problem .

    Win a lottery? Had a great hand at the casino? Did fortune shine upon you in the stock market? 彩票中了大 ...

  5. 【Java】增强的for流程

    增强for循环语法: for(type element: array) {       System.out.println(element); } 可遍历输出数组元素,但无法获取元素下标. 相关链接 ...

  6. REDHAT一总复习1 cups 打印服务配置

    停止cups服务 $ sudo systemctl stop cups $ sudo systemctl status cups 配置cups服务,使其不在系统启动时启动 $ sudo systemc ...

  7. [原创]Matlab2016b打包为C++的lib文件

    这几天在研究如何将Matlab的程序导入到C++进行调用. 由于需要使用到不少Matlab函数,所以之前就有些担心这些函数在导出后是否能够继续使用.不过之后觉得既然已经导出成了一个单独文件,相关运算应 ...

  8. sql表分区

    1.单表达多少条数据后需要分区呢?   a.个人认为要似情况而定,有些常操作的表,分区反而带来麻烦,可以采用物理分表以及其它方法处理:   b.对于一些日志.历史订单类的查询数据,500w左右即可享受 ...

  9. Python员工信息表练习

    1.用户可以模糊查询员工信息 2.显示匹配了多少条,匹配字符需要高亮显示 employee_db.txt 总经办 龚丽丽 总经理 男 -- 1月18日 汉 族 中共党员 已婚 总经办 李惠 副总经理 ...

  10. cookie （储存在用户本地终端上的数据）

    Cookie,有时也用其复数形式 Cookies,指某些网站为了辨别用户身份.进行 session 跟踪而储存在用户本地终端上的数据(通常经过加密).定义于 RFC2109 和 2965 中的都已废弃 ...