安装animate.css

yarn add animate@4.1.1

引用animate.css

import animated from 'animate.css' 
Vue.use(animated)

安装wowjs

yarn add wowjs

引用wowjs

import { WOW } from 'wowjs'

html

其中class这样加 animate__

<div class="wow animate__slideInLeft" data-wow-duration="2s" data-wow-delay="5s"></div>
<div class="wow animate__slideInRight" data-wow-offset="10" data-wow-duration="2s" data-wow-iteration="10"></div>

js

mounted() {
    console.log(new WOW(), 'new WOW')
    var wow = new WOW({
      boxClass: 'wow', // animated element css class (default is wow)
      animateClass: 'animated', // animation css class (default is animated)
      offset: 0, // distance to the element when triggering the animation (default is 0)
      mobile: true, // trigger animations on mobile devices (default is true)
      live: true, // act on asynchronously loaded content (default is true)
      callback: function (box) {
        // the callback is fired every time an animation is started
        // the argument that is passed in is the DOM node being animated
      },
      scrollContainer: null // optional scroll container selector, otherwise use window
    })
    wow.init()
  }