vue.component('元件名稱'， //data必須是乙個函式
template: 模板語法}) //元件中的模板內容必須是單個元素 模板語法 可以是模板字串
var 元件名稱= //區域性元件只能在註冊在他的父元件中使用
components: //全域性元件中不能巢狀區域性元件
《元件名稱》短橫線 my-conponent
駝峰方式 myconponent //普通標籤中必須使用短橫線命名規則
props屬性名規則
在props中使用駝峰形式，模板中使用短橫線的形式 同元件命名規則
在字串形式的模板中沒有限制
props屬性值型別
字串數值 //應使用v-bind進行繫結，否則型別屬於字串型別
布林值 //應使用v-bind進行繫結，否則型別屬於字串型別
陣列物件
@emit(自定義事件名稱) 用於觸發自定義事件
父元件中監聽事件為自定義事件名稱 自定義事件=處理邏輯
@emit(自定義事件名稱，引數) 用於觸發自定義事件
父元件中監聽事件為自定義事件名稱($event) ///($event) 接收值 在處理邏輯中val接收
1.建立 事件中心管理元件
2.監聽事件與銷毀事件
事件中心管理元件.$on('事件名稱, 事件函式});
事件中心管理元件.$off('事件名稱 });
3.觸發事件
子元件中預留插槽位置 並可以賦值預設內容
中間傳遞的值為插槽的值 不賦值 預設為插槽宣告時的值
具名插槽用法
當插槽具有具體的名字時模板渲染時 模板標籤為插槽名稱
呼叫時選擇對應的標籤 並新增slot屬性，值為對應的插槽名稱
如不寫slot屬性 預設新增到 未命名的插槽中
作用域插槽
應用場景：父元件對子元件中的內容進行加工處理
Vue開發與除錯工具
vscode visual studio code windows版本的安裝就很簡單了，傻瓜式安裝，之後去快捷鍵 在當前行中間換行到下一行 ctrl enter 當游標點選到某一行時，預設選中全行，可以直接複製剪下 直接刪除某一行 shift delete或者ctrl shift k 多行游標選擇 ...
Vue元件化開發
1 模組化 模組化開發是從 邏輯角度來劃分的。2 元件化 是從ui介面角度來劃分的。使用標籤形式引入元件 mycom div 建立元件第一種方式 vue.component mycom 建立乙個vue例項 var vm newvue methods script body 使用標籤形式引入元件 my...
Vue元件化開發
前言 1 全域性元件註冊語法 vue.comonent 元件名稱，2 元件的用法 3 元件註冊注意事項 4 元件的命名方式 vue.component my component vue.component mycomponent 5 區域性元件註冊 var componenta var compon...