animateSpecify the like button animation, the default is no animation, you can add animation CSS class, of course, can also introduce CSS animation library, such as animate.css

colorActivate the button when the button color changes, the default is not. Note: The value of this parameter must be filled in hex or rgb color code, rather than the css class

iconTo the slot inside fill in any content you want, it is the carrier of the like button

<template>
  <vue-star animate="animated rubberBand" color="#F05654">
    <a slot="icon" class="fa fa-heart" @click="handleClick"></a>
  </vue-star>
</template>

</script>
export default {
  methods: {
    handleClick () {
      //do something
    }
  }
}
</script>

  <vue-star animate="yourAnimateCssClass" color="rgb(152, 138, 222)">
    <img slot="icon" src="./yourImgPlace/yourImg.png" />
  </vue-star>

  <!--use animate.css and font-awesome -->
  <vue-star animate="animated bounceIn" color="#F05654">
    <i slot="icon" class="fa fa-heart"></i>
  </vue-star>

npm install vue-star

• If used as a global component

//In the project entry file
import Vue from 'vue'
import VueStar from 'vue-star'
Vue.component('VueStar', VueStar)

• If as a local component

//In a component
import VueStar from 'vue-star'
export default {
  components: {
    VueStar
  }
}

If you encounter problems or suggestions in the use, welcome to issues

MIT