Vuejs1.0学习
1、数据双向绑定

双向绑定以后,表单中数据的改变会同步改变H2中的输出

2、v-show
内容输入前:

内容输入后:隐藏提示,展示按钮

代码实现:

此处的v-show可以换成v-if,v-show是隐藏节点,v-if是删除节点
3、事件处理

也可以阻止事件的执行,为了书写方便@替代了v-on:
点击提交后会执行sumitForm方法,但是不能执行submit方法了

click事件,点击+1

4、组件式开发
自定义标签、vue将内容填充进去

效果展示:

5、 两个彩蛋
5.1、引用cdn在线的未压缩JS,console会显示报错信息

5.2、谷歌插件——vue-devtools,方便调试

6、computed
computed property(计算过的属性) 一般用在处理一些逻辑复杂的数据输出

这样便会输出全名
7、列表显示

Vuejs1.0学习的更多相关文章
- Servlet3.0学习总结——基于Servlet3.0的文件上传
Servlet3.0学习总结(三)——基于Servlet3.0的文件上传 在Servlet2.5中,我们要实现文件上传功能时,一般都需要借助第三方开源组件,例如Apache的commons-fileu ...
- solr6.0学习
solr6.0学习(一)环境搭建准备工作:目前最新版本6.0.下载solr 6.0:Solr6.0下载JDK8 下载jdk1.8:jdk1.8[solr6.0是基于jdk8开发的]tomcat8.0 ...
- DirectX 总结和DirectX 9.0 学习笔记
转自:http://www.cnblogs.com/graphics/archive/2009/11/25/1583682.html DirectX 总结 DDS DirectXDraw Surfac ...
- [EntLib]微软企业库5.0 学习之路——第一步、基本入门
话说在大学的时候帮老师做项目的时候就已经接触过企业库了但是当初一直没明白为什么要用这个,只觉得好麻烦啊,竟然有那么多的乱七八糟的配置(原来我不知道有配置工具可以进行配置,请原谅我的小白). 直到去年在 ...
- Bootstrap3.0学习14
Bootstrap3.0学习第十四轮(分页.徽章) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/340 ...
- Bootstrap3.0学习第八轮
Bootstrap3.0学习第八轮(工具Class) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/34 ...
- Bootstrap3.0学习第六轮(表单)
Bootstrap3.0学习第六轮(表单) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.h ...
- Bootstrap3.0学习第三轮(栅格系统案例)
Bootstrap3.0学习第三轮(栅格系统案例) 前言 在前面的一篇文章当中http://www.cnblogs.com/aehyok/p/3400499.html主要学习了栅格系统的基本原理,以及 ...
- 一起学ASP.NET Core 2.0学习笔记(二): ef core2.0 及mysql provider 、Fluent API相关配置及迁移
不得不说微软的技术迭代还是很快的,上了微软的船就得跟着她走下去,前文一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx.superviso ...
随机推荐
- .aspx文件和.aspx.cs文件的区别与联系
http://zhidao.baidu.com/link?url=_SNw0EHJ8Wg__KanJrKQM3tVEUeFnVilZ6GGIN8ab69RLuyOWD__WyZb7Zb9dJjwDnL ...
- win7 redis
<?php /* windows下php安装redis扩展 php_redis下载地址:https://pecl.php.net/package/redis 点击redis安装版本后面的 DLL ...
- 【EasyNetQ】- 简介
EasyNetQ是一个简单易用的,稳定的的RabbitMQ .NET API . 如果您只想尽快启动并运行,请转到“ 快速开始”指南. EasyNetQ的目标是提供一个库,使得在.NET中使用Rabb ...
- oracle约束条件
约束条件有5种 非空约束(not null):约束该列一定要输入值 主关键字约束(primary key):用来唯一标示表中的一个列,一个表中的主键约束只能有一个 外关键字约束(foreign key ...
- 11大精选Android自学网站
无论是从事什么开发,只要是软件行业,不断的更新迭代自己掌握的知识是少不了的.相信干过程序猿的童鞋都清楚,如果要在技术上有所提升,工作之余的不断学习是少不了的.今天小编为大家分享的就是一些比较有用的学习 ...
- BZOJ4399 魔法少女LJJ(线段树合并)
注意到只有增加点/合并的操作.这些操作都可以用线段树完成,于是线段树合并一发就好了.注意乘积大小直接比较肯定会炸,取个对数即可.数据中存在重边. #include<iostream> #i ...
- 【题解】NOIP2016换教室
哇好开心啊!写的时候真的全然对于这个加法没有把握,但还是大着胆子试着写了一下——竟然过了样例?于是又调了一下就过啦. 不过想想也觉得是正确的吧,互相独立的事件对于期望的影响自然也是相互独立的,可以把所 ...
- vector 基础2
size :返回有效元素个数 max_size :返回 vector 支持的最大元素个数 resize :改变有效元素的个数 capacity :返回当前可使用的最大元素内存块数(即存储容量) ...
- ubuntu使用su切换root用户提示“认证失败”
在虚拟机上安装了ubuntu,安装时提示设置密码,也设置了,但是在终端操作时,遇到权限不够的问题,于是就想到就是要切换root用户,获取最高权限. 当我使用 su 切换到root用户时,提示我输入密码 ...
- 解析json方式之net.sf.json
前面转载了json解析的技术:fastjson,今天说下另外一种技术. 下载地址 本次使用版本:http://sourceforge.net/projects/json-lib/files/json- ...