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学习的更多相关文章

  1. Servlet3.0学习总结——基于Servlet3.0的文件上传

    Servlet3.0学习总结(三)——基于Servlet3.0的文件上传 在Servlet2.5中,我们要实现文件上传功能时,一般都需要借助第三方开源组件,例如Apache的commons-fileu ...

  2. solr6.0学习

    solr6.0学习(一)环境搭建准备工作:目前最新版本6.0.下载solr 6.0:Solr6.0下载JDK8 下载jdk1.8:jdk1.8[solr6.0是基于jdk8开发的]tomcat8.0 ...

  3. DirectX 总结和DirectX 9.0 学习笔记

    转自:http://www.cnblogs.com/graphics/archive/2009/11/25/1583682.html DirectX 总结 DDS DirectXDraw Surfac ...

  4. [EntLib]微软企业库5.0 学习之路——第一步、基本入门

    话说在大学的时候帮老师做项目的时候就已经接触过企业库了但是当初一直没明白为什么要用这个,只觉得好麻烦啊,竟然有那么多的乱七八糟的配置(原来我不知道有配置工具可以进行配置,请原谅我的小白). 直到去年在 ...

  5. Bootstrap3.0学习14

    Bootstrap3.0学习第十四轮(分页.徽章)   前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/340 ...

  6. Bootstrap3.0学习第八轮

    Bootstrap3.0学习第八轮(工具Class)   前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/34 ...

  7. Bootstrap3.0学习第六轮(表单)

    Bootstrap3.0学习第六轮(表单) 前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.h ...

  8. Bootstrap3.0学习第三轮(栅格系统案例)

    Bootstrap3.0学习第三轮(栅格系统案例) 前言 在前面的一篇文章当中http://www.cnblogs.com/aehyok/p/3400499.html主要学习了栅格系统的基本原理,以及 ...

  9. 一起学ASP.NET Core 2.0学习笔记(二): ef core2.0 及mysql provider 、Fluent API相关配置及迁移

    不得不说微软的技术迭代还是很快的,上了微软的船就得跟着她走下去,前文一起学ASP.NET Core 2.0学习笔记(一): CentOS下 .net core2 sdk nginx.superviso ...

随机推荐

  1. React & shit Antd

    React & shit Antd https://ant.design/components/tooltip-cn/ https://ant.design/components/tag-cn ...

  2. JVM内存区域配置

    堆内存:新域+旧域 设置堆内存初始化大小 java -Xms128m 设置堆内存初始化大小128MB 设置堆内存最大大小 java -Xmx256m 设置堆内存最大256MB 通常将堆内存的初始化大小 ...

  3. ELK + Kafka + Filebeat

    ELK + Kafka + Filebeat学习 https://blog.csdn.net/qq_21383435/article/details/79463832 https://blog.csd ...

  4. 【bzoj4002】[JLOI2015]有意义的字符串 数论+矩阵乘法

    题目描述 B 君有两个好朋友,他们叫宁宁和冉冉.有一天,冉冉遇到了一个有趣的题目:输入 b;d;n,求 输入 一行三个整数 b;d;n 输出 一行一个数表示模 7528443412579576937 ...

  5. [POI2011]Lightning Conductor

    题面在这里 description 已知一个长度为\(n\)的序列\(a_1,a_2,...,a_n\). 对于每个\(1\le i\le n\),找到最小的非负整数\(p\), 满足对于任意的\(1 ...

  6. [Leetcode] Remove duplicates from sorted array ii 从已排序的数组中删除重复元素

    Follow up for "Remove Duplicates":What if duplicates are allowed at most twice? For exampl ...

  7. BZOJ2631 tree(伍一鸣) LCT 秘制标记

    这个题一看就是裸地LCT嘛,但是我wa了好几遍,这秘制标记...... 注意事项:I.*对+有贡献 II.先下传*再下传+(因为我们已经维护了+,不能再让*对+产生贡献)III.维护+用到size # ...

  8. 牛客多校对抗第6场 A Singing Contest

    [20分]标题:A.Singing Contest | 时间限制:1秒 | 内存限制:256MJigglypuff is holding a singing contest. There are 2n ...

  9. 用Hibernate实现分页查询

    分页查询就是把数据库中某张表的记录数进行分页查询,在做分页查询时会有一个Page类,下面是一个Page类,我对其做了详细的注解: package com.entity; /** * @author:秦 ...

  10. bzoj 2426 【HAOI2010】工程选址 贪心

    [HAOI2010]工厂选址 Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 447  Solved: 308[Submit][Status][Disc ...