Vue元件第一天

2022-07-22 05:21:10 字數 986 閱讀 1490

1.什麼是元件?

元件就是乙個特殊的vue例項,所以大部分vue例項選項在元件中都可以使用

元件也擁有自己data,methods,computed,watch,

元件不需要el,元件的模板就是template屬性

2.定義元件的方式?

全域性定義,全域性定義的元件在任何其他元件中都可以使用,我們把通用公共的元件定義為全域性元件

區域性定義,定義在區域性元件

元件定義需要在建立

3.定義元件注意l  

a.元件的名字不要和原生的html標籤名重複

b.元件的data必須是函式   data:function() }

c.元件是私有作用域

外部訪問不到元件內部的資料

元件也訪問不到外部資料

d.元件最後要在檢視中使用,所以我們需要在檢視中呼叫元件

e.從本質上來講,元件就是讓我們擁有了擴充套件html元素,封裝可重用的**

4.定義元件格式

引數1:元件的名字

引數2:選項物件

template:''

5.如何呼叫元件?

在html頁面中再適合的位置呼叫下面的**:

6.元件通訊:

元件也提供了通訊的能力,也就是輸入與輸出

7.乙個合理的元件化構建的vue應用應該是這樣的:

a.乙個應用僅有乙個根vue例項

根例項的作用就是用來啟動vue程式,把根元件掛載html節點入口

掛載路由

b.乙個應用僅有乙個根元件

8-0:元件樹:

注意:vue也有template模板,例項模板會把el節點給替換掉了

vue中data屬性必須是乙個函式形式,所需要的屬性通過return返回出去

通過template將**塊放檢視,template是元件選項物件

8.專案流程(元件):

Vue基礎第一天

foreach function value,index 4 1.filter 過濾器 filter function item,index let arr 1,2,3,4,5,arr.filter function item,index 4 2.map 對映 對於陣列的對映map function...

Vue筆記第一天

v if和v show v if 如果為true 相當於div.style.display block 如果為false 相當於div.style.display none 陣列 物件的插值v for v for item,index in arrs v for 的優先順序高於v if v show...

學習vue第一天

一.框架和庫的區別。框架 是一套完整的解決方案 對專案的侵入性較大,專案如果需要更換框架,則需要重新架構整個專案。例如 node 的 express框架 庫 外掛程式 提供某乙個小功能,對專案的侵入性較小,如果某個庫無法完成某些需求,可以很容易切換到其它庫實現需求.例如 jquery zepot 移...