码迷,mamicode.com
首页 > Web开发 > 详细

Vuejs1.0学习

时间:2018-02-18 21:55:46      阅读:272      评论:0      收藏:0      [点我收藏+]

标签:定义   gpo   https   处理   表单   github   谷歌   ejs   开发   

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学习

标签:定义   gpo   https   处理   表单   github   谷歌   ejs   开发   

原文地址:https://www.cnblogs.com/lamp01/p/8453208.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!