元件的使用分三個步驟首先:
建立元件構造器
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 ...