Vue 中元件和外掛程式有什麼區別?

2021-10-13 09:10:28 字數 1982 閱讀 6001

我們在vue開發的時候,經常會用到元件和外掛程式,name元件和外掛程式有什麼區別呢?現在就來總結一下。

官方對元件的定義是:

元件就是把圖形、非圖形的各種邏輯均抽象為乙個統一的概念(元件)來實現開發的模式,在vue中每乙個.vue檔案都可以視為乙個元件。

外掛程式通常是為了給vue新增全域性功能的。外掛程式的功能範圍沒有嚴格意義上的限制 – 一般有下面幾種:

兩者的區別主要在一下幾個方面:

1.1 編寫元件

編寫乙個元件,可以有很多方式,我們最常見的就是vue單檔案的這種格式,每乙個.vue檔案我們都可以看成是乙個元件。

vue檔案標準格式

<

/template>

export

default

<

/script>

<

/style>

我們還可以通過template屬性來編寫乙個元件,如果元件內容多,我們可以在外部定義template元件內容,如果元件內容並不多,我們可直接寫在template屬性上。

"testcomponent"

>

// 元件顯示的內容

component!

<

/div>

<

/template>

vue.

component

('componenta'

,)

1.2 編寫外掛程式

vue外掛程式的實現應該暴露乙個install方法。這個方法的第乙個引數是vue構造器,第二個引數是乙個可選的選項物件。

myplugin.

install

=function

(vue, options)

// 2. 新增全域性資源

vue.

directive

('my-directive'

,...})

// 3. 注入元件選項

vue.

mixin

(...})

// 4. 新增例項方法

vue.prototype.

$mymethod

=function

(methodoptions)

}

2.1 元件註冊

vue元件註冊主要分為:全域性註冊與區域性註冊

vue.

component

('my-component-name'

,)

onst component1 =

// 定義乙個元件

export

default

}

2.2 外掛程式註冊

外掛程式的註冊通過vue.use()的方式進行註冊(安裝),第乙個引數為外掛程式的名字,第二個引數是可選擇的配置項

vue.

use(外掛程式名字,

)

注意的是:

註冊外掛程式的時候,需要在呼叫new vue()啟動應用之前完成

vue.use會自動阻止多次註冊相同外掛程式,只會註冊一次

具體的其實在外掛程式是什麼章節已經表述了,這裡在總結一下:

外掛程式(plugin)是用來增強你的技術棧的功能模組,它的目標是vue本身。

簡單來說,外掛程式就是指對vue的功能的增強或補充。

有什麼區別

01 02.程式的版權和版本宣告部分 05.檔名稱 test.cpp 06.作 者 王雅萍 07.完成日期 2014年 4 月 15 日 08.版 本 號 v1.0 09.對任務及求解方法的描述部分 10.輸入描述 無 11.問題描述 12.程式輸出 13.問題分析 略 14.演算法設計 略 inc...

和equals有什麼區別

分為兩種情況 1.比較的型別是基本資料型別時,只比較他們的值是否相等。2.比較型別為引用型別時,比較的是引用變數的記憶體位址是否相同。equals 1.對於普通物件來說,equals 函式原始碼就是實現 所以就是比較引用是否相同。基本型別沒有equals方法 2.對於string來說,就是比較值是否...

MyBatis中 與 有什麼區別

1 是預編譯處理,mybatis在處理 時,它會將sql中的 替換為?然後呼叫preparedstatement的set方法來賦值 2 是 字元 串替換,myba tis在 處理 是字串替換,mybatis在處理 是字串替換 myb atis 在處理時,它會將sql中的 替換為變數的值。注意 使用 ...