add Vue 2.x:动画

This commit is contained in:
qianguyihao
2018-06-17 16:44:13 +08:00
parent e19e6c7e2f
commit 0caa6890ed
9 changed files with 494 additions and 112 deletions

View File

@@ -24,7 +24,6 @@
## Vue初体验
新建一个空的项目引入vue.js文件。写如下代码
@@ -138,7 +137,8 @@ Mustache 标签将会被替代为对应数据对象上 msg 属性msg定义在
运行结果:
20180506_2240.png
![](http://img.smyhvae.com/20180506_2240.png)
## v-cloak
@@ -255,7 +255,7 @@ v-text可以将一个变量的值渲染到指定的元素中。例如
上方代码的演示结果:
20180506_2320.png
![](http://img.smyhvae.com/20180506_2320.png)
其实,第二行代码中,只要浏览器中还没有解析到`v-text="name"`的时候,会显示`------++++++`;当解析到`v-text="name"`的时候name的值会直接替换`------++++++`
@@ -304,7 +304,7 @@ v-text可以将一个变量的值渲染到指定的元素中。例如
运行结果:
20180506_2330.png
![](http://img.smyhvae.com/20180506_2330.png)
## v-bind属性绑定机制
@@ -612,7 +612,7 @@ v-on 提供了click 事件,也提供了一些其他的事件。
if (this.intervalId != null) return; //【注意】这个定时器的this一定不要忘记了
//添加定时器:点击按钮后,让字符串连续滚动
this.intervalId = setInterval(() => {
this.intervalId = setInterval(() => {
// 获取 msg 的第一个字符
var start = this.msg.substring(0, 1);
// 获取 后面的所有字符