vue.js プラグインとはどういう意味ですか?

vue.js プラグインは、通常、Vue にグローバル関数を追加するために使用されます。プラグインの関数スコープは厳密には制限されていません。グローバル メソッド [Vue.use( )] を使用するには、アプリケーションを開始する前に [new Vue( )]Complete を呼び出す必要があります。

[関連記事の推奨事項: vue.js]

プラグインは通常、追加するために使用されます。 Vue 関数へのグローバル。プラグインの機能範囲には厳密な制限はありません。通常は次のタイプがあります。

• グローバル メソッドまたはプロパティを追加します。例: vue-custom-element

• グローバル リソースを追加します: ディレクティブ/フィルター/トランジションなど。たとえば、vue-touch

• は、グローバル ミキシングを通じていくつかのコンポーネント オプションを追加します。たとえば、vue-router

• は、Vue.prototype に Vue インスタンス メソッドを追加します。

• 上記の 1 つ以上の関数を提供しながら、独自の API を提供するライブラリ。たとえば、vue-router

プラグインの使用

グローバル メソッド Vue.use() を通じてプラグインを使用します。 new Vue() を呼び出してアプリケーションを開始する前に完了する必要があります:

// 调用 `MyPlugin.install(Vue)`
Vue.use(MyPlugin)
new Vue({
  // ...组件选项
})

オプションのオプション オブジェクトを渡すこともできます:

Vue.use(MyPlugin, { someOption: true })

Vue.use は自動的に複数の登録を防止します。同じプラグインの場合、プラグインは複数回呼び出されても 1 回だけ登録されます。

Vue.js によって正式に提供される一部のプラグイン (vue-router など) は、Vue がアクセス可能なグローバル変数であることを検出すると、自動的に Vue.use() を呼び出します。ただし、CommonJS のようなモジュール環境では、常に Vue.use() を明示的に呼び出す必要があります。

// 用 Browserify 或 webpack 提供的 CommonJS 模块环境时
var Vue = require('vue')
var VueRouter = require('vue-router')
// 不要忘了调用此方法
Vue.use(VueRouter)

awesome-vue には、コミュニティ提供のプラグインとライブラリの大規模なコレクションがあります。

プラグインの開発

Vue.js プラグインは、install メソッドを公開する必要があります。このメソッドの最初のパラメーターは Vue コンストラクターで、2 番目のパラメーターはオプションのオプション オブジェクトです:

MyPlugin.install = function (Vue, options) {
  // 1. 添加全局方法或 property
  Vue.myGlobalMethod = function () {
    // 逻辑...
  }
  // 2. 添加全局资源
  Vue.directive('my-directive', {
    bind (el, binding, vnode, oldVnode) {
      // 逻辑...
    }
    ...
  })
  // 3. 注入组件选项
  Vue.mixin({
    created: function () {
      // 逻辑...
    }
    ...
  })
  // 4. 添加实例方法
  Vue.prototype.$myMethod = function (methodOptions) {
    // 逻辑...
  }
}

関連する無料学習の推奨事項: JavaScript (ビデオ)

以上がvue.js プラグインとはどういう意味ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。