当前位置:首页 > 资讯 > info5 > 正文

vue文档迷惑 处

发表于: 2016-04-30   作者:u013742084   来源:转载   浏览:
摘要: #track-by#track-by$index数组中的$remove事件:对象数组不能应用此事件事件修饰符: ... ...lazy在默认情况下,v-model 在input 事件中同步输入框值与数据,可以添加一个特性 lazy,从而改到在 change 事件中同步: 过渡流程详解当 show 属性改变时,Vue.js将相应地插入或删除  元素,按照如下规则改变过渡的CS

#track-by

#track-by $index

数组中的$remove事件:对象数组不能应用此事件

事件修饰符:

<!-- 阻止单击事件冒泡 -->
<a v-on:click.stop="doThis"></a>

<!-- 提交事件不再重载页面 -->
<form v-on:submit.prevent="onSubmit"></form>

<!-- 修饰符可以串联 -->
<a v-on:click.stop.prevent="doThat">

<!-- 只有修饰符 -->
<form v-on:submit.prevent></form>

<!-- 添加事件侦听器时使用 capture 模式 -->
<div v-on:click.capture="doThis">...</div>

<!-- 只当事件在该元素本身(而不是子元素)触发时触发回调 -->
<div v-on:click.self="doThat">...</div>

lazy

在默认情况下,v-model 在input 事件中同步输入框值与数据,可以添加一个特性 lazy,从而改到在 change 事件中同步:

<!-- 在 "change" 而不是 "input" 事件中更新 -->
<input v-model="msg" lazy>

过渡流程详解

当 show 属性改变时,Vue.js 将相应地插入或删除 <div> 元素,按照如下规则改变过渡的 CSS 类名:

  • 如果 show 变为 false,Vue.js 将:

    1. 调用 beforeLeave 钩子;
    2. 添加 v-leave 类名到元素上以触发过渡;
    3. 调用 leave 钩子;
    4. 等待过渡结束(监听 transitionend 事件);
    5. 从 DOM 中删除元素并删除 v-leave 类名;
    6. 调用 afterLeave 钩子。
  • 如果 show 变为 true,Vue.js 将:

    1. 调用 beforeEnter 钩子;
    2. 添加 v-enter 类名到元素上;
    3. 把它插入 DOM;
    4. 调用 enter 钩子;
    5. 强制一次 CSS 布局,让 v-enter 确实生效。然后删除 v-enter 类名,以触发过渡,回到元素的原始状态;
    6. 等待过渡结束;
    7. 调用 afterEnter 钩子。

另外,如果在它的进入过渡还在进行中时删除元素,将调用 enterCancelled 钩子,以清理变动或 enter 创建的计时器。反过来对于离开过渡亦如是。

上面所有的钩子函数在调用时,它们的 this 均指向其所属的 Vue 实例。编译规则:过渡在哪个上下文中编译,它的 this 就指向哪个上下文。



vue文档迷惑 处

  • 0

    开心

    开心

  • 0

    板砖

    板砖

  • 0

    感动

    感动

  • 0

    有用

    有用

  • 0

    疑问

    疑问

  • 0

    难过

    难过

  • 0

    无聊

    无聊

  • 0

    震惊

    震惊

编辑推荐
transition 与 v-for 一起用时可以创建渐近过渡。给过渡元素添加一个特性 stagger,enter-stagger 或
先看Modal.vue代码 <template> <div draggable="true" class="modal" v-bind:style="{ 'wi
vueJS的源码解读 vue源码总共包含约一万行代码量(包括注释)特别感谢作者Evan You开放的源代码,访
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
一、先创建一张mongo表,右击已创建的数据库test,点击addcollection.. 输入Collection Name,点击o
转自:http://my.oschina.net/u/1026531/blog/188336 一、先创建一张mongo表,右击已创建的数据库te
众所周知最近几年前端发展非常的迅猛,除各种框架如:backbone、angular、reactjs外,还有模块化开
今天在写页面的时候发现头部导航栏的下拉菜单,被下面的画中画遮挡住了,然后把导航的下拉菜单样式
今天在写页面的时候发现头部导航栏的下拉菜单,被下面的画中画遮挡住了,然后把导航的下拉菜单样式
版权所有 IT知识库 CopyRight © 2009-2015 IT知识库 IT610.com , All Rights Reserved. 京ICP备09083238号