Vue.js中翻转元素 - vue-flip

Vue.js中翻转元素 - vue-flip
插件名称 vue-flip
发布时间 2020年6月23日
插件作者 kgrandemange

一个vue.js组件,使您能够翻转Web应用程序上的元素。

变更日志:

09/22/2020

  • v2.0.3

2020/06/21

  • v1.0.2: 已针对Vue.js 3更新。

安装和下载:

# NPM
$ npm install vue-flip --save

用法

使用此模板:

<vue-flip>
  <template v-slot:front>
    前面
  </template>
  <template v-slot:back>
    背面
  </template>
</vue-flip>

您可以通过以下方式激活点击翻转:

<vue-flip active-click></vue-flip>

或者,您可以使用以下命令激活悬停功能:

<vue-flip active-hover></vue-flip>

或者您可以绑定一个变量:

<vue-flip v-model="flipped"></vue-flip>
this.flipped = true; //or false -> to flip front/back