6

グローバルに利用できるミックスインを作成しようとしていますが、すべてのコンポーネントに自動的に挿入されるわけではありません。つまり、私はこれを望んでいません:Vue.mixin({...});

これらの指示に従ってプロジェクトをセットアップしました。これが私のプロジェクト構造です。assets/js/mixins.jsミックスインを含むファイルもあります。

個々の .vue ファイルでこれを実行できるようにしたいと考えています (コンポーネントの多くは使用していますmyMixinが、すべてではありません)。

<script>
export default {
    mixins:[myMixin],
    data:{....}
}
</script>
<template>
  <!-- some template code -->
</template>

これまでのところ、それを行う唯一の方法は、この行を必要とするすべてのコンポーネントの先頭に追加することです。

import {myMixin} from './assets/js/mixins.js"

しかし、これを一度行い、myMixin変数をグローバルに利用できるようにする方法はありますか? 私はそれを含めようとしましたが、子コンポーネントのいずれかで使用しようとするmain.jsとapp.vue、「myMixin が定義されていません」というエラーが表示されます。myMixin

mixins.jsまたは、各コンポーネントでファイルへのパスを入力する必要のないミックスインを登録する別の方法はありますか?

4

3 に答える 3

11

ミックスインをプラグインとして設定することをお勧めします。これを行うには、それを関数呼び出し install 内にラップし、install 関数をエクスポートします。次に、アプリをインスタンス化する場所で、Vue.use(yourMixin) を実行するだけです。

ドキュメント:

https://vuejs.org/guide/plugins.html

http://vuejs.org/api/#Vue-mixin

例：

//- build your mixin
const mixin = {
  // do something
}

//- export it as a plugin
export default {
  install (Vue, options) {
    Vue.mixin(mixin)
  }
}

//- make it globally available
import myMixin from './myMixin'
Vue.use(myMixin)

Vue.use は install fn() で呼び出すため、後続のすべての Vue (またはまだ作成されていない場合はすべて) に mixin 機能があります。

グローバルに利用可能な mixin での名前空間の衝突に注意してください (!)

于 2016-04-08T20:41:45.237 に答える