vue 基础学习 第五天

41 css 动画

• 使用 animate.css
• 代码

 

    切换
    
    
    
        
测试
    

• 使用 标签将要受到动画影响的元素包起来
• 在 标签中指定属性 enter-active-class="显示过程动画样式类"...
• 一共有这么几个属性：

# enter="开始进入的样式"
# enter-active="进入过程中"
# enter-to="进完成后"
# leave-active="离开过程中"
# leave="完全离开后"

42 directive 自定义指令

• 代码

• 使用 Vue.directive('指令名称', { 动作() { //触发时执行的代码 } })
• 在标签上使用 v-指令名称 来将指令绑定到元素上
• bind() 动作是指元素被载入后就触发的动作
• update() 动作是指元素被更新时触发的操作
• 通常我们就使用 bind 和 update 两个动作，所有很多时候我们可以简写为 Vue.directive('指令名称', function() { //同时绑定update 和 bind 动作 })

43 在组件中使用指令

• 代码

    
字
    

• 指令都写在 directives 属性中
• 同样，直接写指令() {} 是直接绑定 bind 和 update 两个动作
• 如果要用其他动作，则可以使用 指令: { 动作() { //代码 } }