<!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. Swift-UIButton

    // let bt = UIButton(frame:CGRectMake(10,20,50,50)) let button = UIButton(frame:CGRectMake(10, 150, ...

  2. Oracle下批量将一个用户的所有表的select权限赋值给另外一个用户

    起因 为什么会有这篇文章呢? 因为最近在做项目的时候遇到一个问题...实际生产环境中程序datasource登陆的Oracle数据库用户user1不是我们创建的.这个用户没有访问我们业务表的权限(因为 ...

  3. tomcat集群学习记录1--初识apache http server

    起因 平时开发的时候我都是用eclipse把代码部署到本地tomcat的,当然只会去跑1台tomcat啦... 偶尔有时候解决问题需要去公司测试环境找日志.连上公司测试环境以后发现竟然有2台weblo ...

  4. 使用powershell批量添加Qt的文件(生成pro)

    想使用QtCreator作为编辑器编辑keil或者IAR的工程,需要生成.pro文件,于是使用powershell批量处理. 源码如下: $incPath = dir -filter "*. ...

  5. 再谈如何使用Taglist?

    以前使用个taglist, 但是只是查看, 没有熟练的去使用, 补充一下: 参考文章: http://blog.csdn.net/vaqeteart/article/details/4146618 用 ...

  6. RESTful 接口调试分享利器 restc

    这个工具来自于https://elemefe.github.io/restc/  这里对Abp进行了一次封装 1.在项目中添加nuget包 Abp.Web.Api.Restc 2.在项目Abp模块的D ...

  7. iOS面试题

    一个区分度很大的面试题 考察一个面试者基础咋样,基本上问一个 @property 就够了: @property 后面可以有哪些修饰符? 线程安全的: atomic,nonatomic 访问权限的 re ...

  8. 在Node.js使用mysql模块时遇到的坑

    之前写了个小程序Node News,用到了MySQL数据库,在本地测试均没神马问题.放上服务器运行一段时间后,偶然发现打开页面的时候页面一直处于等待状态,直到Nginx返回超时错误.于是上服务器检查了 ...

  9. permission denied to create extension "hstore"解决方案

    首先 sudo -u postgres psql postgres 进入数据库后输入命令 ALTER USER mydb_user WITH SUPERUSER;        (把某个用户设置为超级 ...

  10. apache和tomcat有什么不同，为什么要整合apache 和tomcat

    1. Apache是web服务器,Tomcat是应用(java)服务器,它只是一个servlet容器,是Apache的扩展.2. Apache和Tomcat都可以做为独立的web服务器来运行,但是Ap ...