vue-cli--グローバルコンポーネントのカスタマイズ
1200 ワード
一、グローバル構成
1、共通コンポーネントの作成
componentsフォルダloadにloadingを新規作成します.vueとloading.js 2つのファイル、vueファイルは共通コンポーネントを書くために使用され、jsはこのコンポーネントをエクスポートするために使用されます.
2、共通コンポーネントのエクスポート
loading.jsでは、このコンポーネントを使用する名前と、使用方法を規定しています.
3、共通コンポーネントの導入
4、共通コンポーネントを呼び出す
カスタムコンポーネントは、プロジェクト内の任意の場所で使用できます.
二、局部配置
1、全体のコンポーネントを書く
componentsにloadingを作成します.vueのファイル、中に論理コードを書きます
2、局部導入コンポーネント
ここでは上記より簡単に、このコンポーネントを使用する必要があるvueファイルに直接このvueファイルを導入し、componentに登録すれば使用できます.
転載先:https://www.cnblogs.com/zjh-study/p/10647652.html
1、共通コンポーネントの作成
componentsフォルダloadにloadingを新規作成します.vueとloading.js 2つのファイル、vueファイルは共通コンポーネントを書くために使用され、jsはこのコンポーネントをエクスポートするために使用されます.
2、共通コンポーネントのエクスポート
loading.jsでは、このコンポーネントを使用する名前と、使用方法を規定しています.
import Loading from './loading.vue'
const loading={
install:function(Vue){
// Vue.component()
Vue.component('loading',Loading)
} // loading' ,install vue
}
export default loading
3、共通コンポーネントの導入
// main.js , vue
import Loading from './loading'
Vue.use(Loading)
4、共通コンポーネントを呼び出す
カスタムコンポーネントは、プロジェクト内の任意の場所で使用できます.
二、局部配置
1、全体のコンポーネントを書く
componentsにloadingを作成します.vueのファイル、中に論理コードを書きます
2、局部導入コンポーネント
ここでは上記より簡単に、このコンポーネントを使用する必要があるvueファイルに直接このvueファイルを導入し、componentに登録すれば使用できます.
//
import Loading from '@/components/loading'
// , ,
components: {
Loading
}
//
転載先:https://www.cnblogs.com/zjh-study/p/10647652.html