Vue 元件引數校驗與非props特性

2021-09-12 16:15:15 字數 1364 閱讀 6847

元件的引數校驗指的是什麼呢?你父元件向子元件傳遞的內容,子元件有權對這個內容進行一些約束,這個約束我們可以把它叫做引數的校驗。

vue.component('child',}'})

let vm = new vue()

現在有這樣乙個需求,父元件呼叫子元件的時候,傳遞的這個content,我要做一些約束,要求它我傳遞過來的content必須是乙個字串,我們該怎麼實現呢?

vue.component('child',,

template: '}'})

let vm = new vue()

元件接收到的content這個屬性,必須是乙個字串型別的,如果我需要的引數型別是字串或者陣列,又該怎麼寫呢?

props: ,
content的型別,可以用陣列來表示。

content其實還有更複雜的用法:

props: }}

說到非props特性,它一定和props特性相對應。

props特性:當你的父元件使用子元件的時候,通過屬性向子元件傳值的時候,恰好子元件裡面宣告了對父元件傳遞過來的屬性的乙個接收,也就是說父子元件有個對應關係,如果你這麼寫我們就把叫做props特性

props特性的特點是,如下圖:

我們在子元件裡有乙個content的內容傳遞,這個屬性的內容傳遞是不會在dom標籤上進行顯示的。

當你父元件傳遞了content,你子元件接收了這個content,你在模版裡就可以直接通過插值表示式或者通過this.content,去取得content裡面的內容了。

props特性:父元件向子元件傳遞了乙個屬性,但是子元件並沒有props這塊的內容,也就是說子元件並沒有宣告我要接收父元件的傳遞過來的內容

props特點:

props特性在子元件裡面,沒辦法獲取到你父元件傳遞的內容,因為你壓根沒宣告你要獲取的內容,也就沒法用。

如果我們用的是非props特性,那麼這個特性是會顯示在dom標籤上的

Vue 元件引數校驗與非props特性

元件的引數校驗指的是什麼呢?你父元件向子元件傳遞的內容,子元件有權對這個內容進行一些約束,這個約束我們可以把它叫做引數的校驗。vue.component child let vm new vue 現在有這樣乙個需求,父元件呼叫子元件的時候,傳遞的這個content,我要做一些約束,要求它我傳遞過來的...

Vue 元件引數校驗與非props特性

元件的引數校驗指的是什麼呢?你父元件向子元件傳遞的內容,子元件有權對這個內容進行一些約束,這個約束我們可以把它叫做引數的校驗。vue.component child let vm new vue 現在有這樣乙個需求,父元件呼叫子元件的時候,傳遞的這個content,我要做一些約束,要求它我傳遞過來的...

Vue元件引數校驗與非props特性

父元件是通過屬性繫結的方式向子元件傳值的,子元件有權對父元件傳來的引數進行一些約束,我們就稱這為元件引數校驗。比如我們希望約束父元件傳遞來的資料都是字串型的 root hello world child div 定義乙個全域性元件 vue.component child template var v...