在 Vue Mixin 中导入的方法未被 Transition 找到

Question

我有用于jQuery样式幻灯片动画的方法，我在许多组件中使用了这些方法。为了在修复错误的同时干掉我的代码，我试图将方法移动到 mixin，但现在我只是在加载时收到错误：

属性或方法"slideEnter"未在实例上定义，但在呈现期间引用

这是我到目前为止所做的;我需要从中解决什么问题？

过渡混合.js

exports = {
  slideEnter: function() {...},
  slideLeave: function() {...}
}

my-component.vue

<template>
  <div>
    <button @click="show = !show">Toggle</button>
    <transition 
       v-on:enter="slideEnter"
       v-on:leave="slideLeave">
         <p v-show="show">My Content</p>
    </transition>
  </div>
</template>
<script>
  import TransitionsMixin from '../transitions.js'
  export default {
    name: 'my-component',
    mixins: [TransitionsMixin],
    data: function() {
      return {
        show: false
      }
    }
  }
</script>

Answer 1

你的混音不正确。

在此处查看文档：https://v2.vuejs.org/v2/guide/mixins.html

你必须把你的函数放在一个方法对象中，然后与你的组件方法对象合并。

过渡混合.js

export default {
  methods: {
    slideEnter: function() {...},
    slideLeave: function() {...}
  }
}