<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>vue</title> <!--
<script src="vue.js"></script>
--> <script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/lodash@4.13.1/lodash.min.js"></script>
</head>
<body> <div id='vm01'>
<!--
<li v-for="n in evenNumbers">{{n}}</li>
-->
<input @keyup.f1="submit"></input> </div> <div id="example-5" class="demo">
<select v-model="selected">
<option>A</option>
<option>B</option>
<option>C</option>
</select>
<span>Selected: {{ selected }}</span>
</div> <div id="example-2">
<simple-counter></simple-counter>
<simple-counter></simple-counter>
<simple-counter></simple-counter>
</div> <script> var data = { counter: 0 }
Vue.component('simple-counter', {
template: '<button v-on:click="counter += 1">{{ counter }}</button>',
// 技术上 data 的确是一个函数了,因此 Vue 不会警告,
// 但是我们返回给每个组件的实例的却引用了同一个data对象
data: function () {
return {counter:0}
}
})
new Vue({
el: '#example-2'
}) new Vue({
el: '#example-5',
data: {
selected: null
}
}) var vm01= new Vue({
el:"#vm01",
data:{evenNumbers:[1,2,3,9,10]},
methods: {
submit: function(){
alert(" use key 13 ");
}
}
}) /*
var vm01= new Vue({
el:"#vm01",
data:{evenNumbers:[1,2,3,9,10]} }) */ /*
var vm01= new Vue({
el:"#vm01",
data:{numbers:[1,2,3,9]},
computed:
{
evenNumbers: function () {
return this.numbers.filter(function (number) {
//return number % 2 === 0
return number })
}
} })
*/ </script> </body>
</html>

vuejs v-model的更多相关文章

  1. 什么是V模型?使用SDLC和STLC学习案例研究

    本教程详细介绍了软件/系统开发生命周期(SDLC),如瀑布循环和迭代循环,如RAID和Agile.此外,它继续解释测试的V模型和STLC(软件测试生命周期). 假设为您分配了一项任务,即为客户开发自定 ...

  2. 阶段5 3.微服务项目【学成在线】_day02 CMS前端开发_04-vuejs研究-vuejs基础-v-model指令

    <!DOCTYPE html> <html lang="en" xmlns:v‐on="http://www.w3.org/1999/xhtml&quo ...

  3. 不可错过的效能利器「GitHub 热点速览 v.22.39」

    如果你是一名前端工程师且维护着多个网站,不妨试试本周榜上有名的 HTML-first 的 Qwik,提升网站访问速度只用一招.除了提升网站加载速度的 Qwik,本周周榜上榜的 Whisper 也是一个 ...

  4. Building the Testing Pipeline

    This essay is a part of my knowledge sharing session slides which are shared for development and qua ...

  5. vue.js初级入门之最基础的双向绑定操作

    首先在页面引入vue.js以及其他需要用到的或者可能要用到的插件(这里我多引用了bootstrap和jquery) 引用的时候需要注意文件的路径,准备工作这样基本就完成了,下面正式开始入门. vue. ...

  6. opengles 矩阵计算

    总的变换矩阵: matrix = projection * view * model 模型矩阵: modelMatrix=translateMatrix * scaleMatrix * rotateM ...

  7. 七天学会ASP.NET MVC (五)——Layout页面使用和用户角色管理

    系列文章 七天学会ASP.NET MVC (一)——深入理解ASP.NET MVC 七天学会ASP.NET MVC (二)——ASP.NET MVC 数据传递 七天学会ASP.NET MVC (三)— ...

  8. backbone学习总结(二)

    今天来看下backbone的路由控制的功能.其实个人感觉backbone,模块就那么几个,熟悉它的框架结构,以及组成,就差不多. 废话不多说,我们来看看还剩下的功能. 关于路由和历史管理 通过 Bac ...

  9. yii2框架增删改查案例

    //解除绑定蓝牙 //http://www.520m.com.cn/api/pet/remove-binding?healthy_id=72&pet_id=100477&access- ...

  10. backbone学习总结(一)

    入职第三天,新公司项目用到backbone+underscore+require等框架,前两天把项目的开发环境都配置好啦,项目也能跑起来,现在准备好好学习公司自己的框架以及用到的框架,有点想吐槽,开发 ...

随机推荐

  1. spring mvc 插入一条数据 返回该数据的主键编号

    import org.springframework.jdbc.core.PreparedStatementCreator; import org.springframework.jdbc.suppo ...

  2. ubuntu16.04安装破解pycharm

    分两步,首先安装jdk,然后安装并破解pycharm 一.安装jdk 参考:http://blog.csdn.net/yebhweb/article/details/55098189 下载jdk1.8 ...

  3. ubuntu12.04下CKermit与开发板交互环境搭建

    CKermit蛮好的一个调试工具!就像在windows下的telnet,但是还是折腾了一下,现在看来,非常容易,其实我主要是在开发板为正常工作的情况下,以为是CKermit的问题,其实是我开发板开机设 ...

  4. [JZOJ 5437] [NOIP2017提高A组集训10.31] Sequence 解题报告 (KMP)

    题目链接: http://172.16.0.132/senior/#main/show/5437 题目: 题解: 发现满足上述性质并且仅当A序列的子序列的差分序列与B序列的差分序列相同 于是我们把A变 ...

  5. 整数转罗马数字 C++实现 java实现 leetcode系列(十二)

    罗马数字包含以下七种字符: I, V, X, L,C,D 和 M. 字符 数值 I 1 V 5 X 10 L 50 C 100 D 500 M 1000 例如, 罗马数字 2 写做 II ,即为两个并 ...

  6. Creating a New Master Page in SharePoint 2013

    Creating a New Master Page in SharePoint 2013 This article explains how to create a Master Page in S ...

  7. Java绘图技术基础

    public class Demo1 extends JFrame{ MyPanel mp=null; public static void main(String[] args){ Demo1 de ...

  8. swift语言点评十四-继承

    Overriding A subclass can provide its own custom implementation of an instance method, type method, ...

  9. 条件变量本质-Problem statement-while not( P ) do skip

    条件变量相当于订阅-发布机制: 或者相当于同步的通知机制: 订阅和发布具有先后顺序:所以需要互斥量来维护顺序. 顺序不对,存在信号丢失问题. Problem statement[edit] For m ...

  10. Dapper基础知识四之 利用Dapper获取不同类型的主键值

    在下刚毕业工作,之前实习有用到Dapper?这几天新项目想用上Dapper,在下比较菜鸟,这块只是个人对Dapper的一种总结. 一下是Dapper源码几种主键,当主键不包含"ID" ...