Vue學習總結之二

2021-10-07 02:59:05 字數 1291 閱讀 1448

元件的使用分三個步驟首先:

建立元件構造器

const firstcomponent = vue.

extend

()

註冊元件

vue.

component

('f-comp'

,firstcomponent)

使用元件

<

/f-comp>

vue.component()註冊元件時,元件的註冊是全域性的,可以被掛載在任意乙個vue建立出來的例項中使用

vue.

component

('s-comp'

,)

區域性元件:

let vm =

newvue(}

})

模板可以分離出去,script標籤的型別選擇x-template,一定要寫id,然後在元件中繫結id。

或者使用標籤

vue元件有自己儲存資料的地方,與例項不同的是

data是乙個函式,並且需要return你所需要的資料,這個資料是物件

為什麼data在元件中必須是乙個函式呢?

原因是在於vue讓每個元件物件都返回乙個新的物件,因為如果是同乙個物件的,元件在多次使用後會相互影響。

父傳子採用props,子傳父採用事件傳送訊息

在元件中使用

我是插槽<

/slot>

就能開啟乙個插槽

該插槽插入什麼內容由父元件決定,中的內容表示,如果沒有在該元件中插入任何其他內容,就預設顯示該內容

<

/comp> 顯示預設內容「」「我是插槽」

好好<

/h2>

<

/comp> 顯示h2的內容「」「好好」

我們給插槽乙個屬性name,插槽就變成了具名插槽,當父元件中那個標籤想要放在對應插槽就可以使用slot = 「name屬性值」,就會把該內容放到對應具名插槽中。

模組化開發其實就是封裝

在乙個函式或類前面加上export就可以將這個類匯出,而在另乙個檔案中使用import就可以匯入這個函式或類。

我們可以使用export default匯出函式或者類,到時候在使用import匯入時使用者可以自定義名字。但是在同乙個模組中export default只允許存在乙個

JS學習總結之二

正規表示式 用來定義一些字串的規則,計算機可以根據正規表示式來檢查字串是否合乎規則,將合乎規則的提取出來。用typeof檢查其型別為object。1 建立正規表示式物件 1 var 變數 new regexp 正規表示式 匹配模式 其中匹配模式有兩種 i 忽略大小寫 g 全域性匹配模式 2 var ...

VUE學習總結(二)

1 計算屬性 computerd set function newvalue 2 class繫結 data computed methods,表示式較長或邏輯複雜,優先使用computed。例項data中給出 isactive iserror的值 class條件過多時 超過兩個 也可以繫結計算屬性,...

如何入門vue之二

學習完指令之後我們需要學習的就是元件。在學習元件前我們要了解一下 methods 用來處理事件的。computed用來計算屬性 他就是類似於data一樣只不過是動態的處理資料 裡面寫的方法當成屬性直接使用 注意的是它不能傳引數。data用來存放需要展示的資料。元件內的data 需要使用return ...