javascript - NuxtJs vue-flip 不在正面和背面之间翻转

标签 javascript vue.js nuxt.js

我确实安装了vue-flip进入使用以下命令创建的 NuxtJs (VueJS) 项目:npx create-nuxt-app <project-name> .

在index.vue文件中我只是添加:

<vue-flip active-click="true">
    <div slot="front">
      front
    </div>
    <div slot="back">
      back
    </div>
</vue-flip>

我在 nuxt.config.js 注册了该插件:

  plugins: [
    '~/plugins/vue-flip'
  ]

并在插件文件夹中创建文件 vue-flip.js :

import Vue from 'vue'

import VueFlip from 'vue-flip'

Vue.use(VueFlip)

运行 npm run dev 并在 localhost:3000 后,前面和后面的文本都可见,而不是仅显示前面的文本,因此单击后面的文本时会出现。

我该如何解决?

最佳答案

您检查过控制台是否有错误吗?因为应该有的..

根据文档https://www.npmjs.com/package/vue-flip不是一个vue插件而是一个组件,所以它不会像这样工作。您需要将其指定为使用它的组件。

import VueFlip from 'vue-flip';
export default {
  components: {
    'vue-flip': VueFlip
  }
}

关于javascript - NuxtJs vue-flip 不在正面和背面之间翻转,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55748546/

相关文章:

arrays - 如何在 Vuex Store 中管理嵌套数组并通过组件传递它

vue.js - Vuetify SassError : Expected identifier

jestjs - Jest 失败并出现 SyntaxError : Unexpected token {

javascript - 窗口未定义,Vue 平滑滚动 - Nuxt.js

javascript - 如何将索引值从 Angular 中的 ng-repeat 传递给 Controller

javascript - Angular 4如何显示隐藏嵌套表单组验证

javascript - 如何测试组件中另一个模块的自定义指令

javascript - v-on :click ="..." and using onclick ="..." in Vue. js的区别

javascript - 值更改时 Angular ng-bind 未更新

javascript - 使用 SVG 并应用样式表中的 CSS