資料驅動和元件化是vue.js兩個最重要的特點。元件化是為了方便**復用，提高開發效率。常見的vue元件寫法有四種，各有特色，適用於不同的場景。
結構:
// 元件的註冊
vue.
component
('componentname',}
, method:
......
// 元件其他的屬性和方法})
// 元件的使用
newvue
()
<1>可以直接在html檔案中的script標籤內直接定義與使用；
<2>通過該方法定義的元件是全域性元件，在任何vue例項下都可以使用，適合專案比較簡單的場景；
<3>每次定義元件時都要重新使用vue.component()，且元件名不能相同；
結構:
// 構造元件物件
const componentname =},
method:
......
// 元件其他的屬性和方法
}// 元件的使用
newvue(}
)
特點:<1>與全域性方式定義的元件相似，都可以直接在html檔案中的script標籤中直接書寫元件與使用；
<2>只有在註冊過的vue例項中才能使用該元件；
結構:
"componnet"
>
// 元件的html結構
<
/template>
// 全域性元件的註冊與使用
vue.
component
('componentname',}
, method:
......
// 元件其他的屬性和方法})
newvue
()
// 區域性元件的註冊與使用
const componentname =},
method:
......
// 元件其他的屬性和方法
}new
vue(
})
特點:<1>js檔案中不包含html結構內容，實現結構與邏輯分離；
結構：
"html"
>
// 元件中的html結構
<
/template>
//元件的邏輯
export
default
<
/script>
"css" scoped>
// 元件的樣式
<
/style>
特點:<1>元件與元件之間互不影響，復用性高，其html、css、js均可復用；
<2>元件的結構、邏輯清晰；
<3>適用於大型複雜專案，適合多人開發；
Vue元件通訊的四種方式彙總
前言 眾所周知vue是一種mvvm框架，它相對於jquery可能比較大的差異點之一就在於元件之間的通訊了。本文重點是梳理了前兩個,父子元件通訊和eventbus通訊,我覺得vue文件裡的說明還是有一些簡易,我自己第一遍是沒看明白vqnof。第一種通訊方式 父子元件通訊 父元件向子元件傳遞資料 父元件...
Vue2 模板template的四種寫法
閱讀數 3106 html view plain copy divid h1 我是直接寫在構造器裡的模板1 h1 div templateid demo3 h1style color red 我是選項模板3 h1 template script type x template id demo4 h1...
SQL Update的四種常見寫法
實驗物件 兩個學生表 1.乙個stu學生表,乙個stu1學生表.2.上述表有三個字段 學生id,學生性別,學生名字 update語句常見場景,分為兩大類 1.單錶update 2.多表關聯update 1.1 單錶update單字段 update stu t set t.name mike wher...