vue中使用animate.css

• 安装

yarn add animate.css // 默认安装到dependencies
或者
npm install animate.css // 默认安装到dependencies

• vue项目引入

// main.js
import animate from 'animate.css'
Vue.use(animate)

• 单个节点过渡

      
      
hello
  

• 列表过渡
  注意：每个节点都有有唯一的key

        

          

            业务单号：{{ item.order ? item.order : "--" }}
          
          

            

              

                {{ value.otype === 1 ? "出库信息" : "入库信息" }}：{{
                  value.mname ? value.mname : "--"
                }}
              
              

                {{ value.type ? value.type : "--" }}
              
              
{{ value.mnum ? value.mnum : "--" }} m³
              
              
            
          
        
      

• 各个阶段钩子函数

  
  
  image.png
  
  
  image.png

vue官网 进入/过渡 & 列表过渡链接：https://cn.vuejs.org/v2/guide/transitions.html

animate.css https://animate.style/