vue實踐區域性元件需求 投票

2021-10-07 01:58:06 字數 2060 閱讀 6569

投票

區域性元件實踐和元件之間的巢狀:

1.搭建結構(html+css布局)

2.在元件標籤中拆分成多個區域性元件

3.刪除第一步的搭建結構(html+css布局)**

4.在元件中調取渲染使用

國風大賞投票h3

>

>

vote-content

>

>

vote-button

>

div>

template

>

"votecontenttemplate"

>

class

="content"

>

>

支援人數:>

0span

>

p>

>

反對人數:>

0span

>

p>

>

支援率:>

0%span

>

p>

div>

template

>

"votebuttontemplate"

>

class

="footer"

>

type

="button"

class

="btn btn-primary"

>

支援button

>

type

="button"

class

="btn btn-danger"

>

反對button

>

div>

template

>

src=

"../node_modules/vue/dist/vue.min.js"

>

script

>

>

//=>註冊元件

//=>在元件中調取渲染使用

const votecontent =}}

;const votebutton =}}

;const myvote =},

components:};

let vm =

newvue(}

)script

>

body

>

html

>

執行效果如下:

vue基礎實踐 區域性元件

知識點總結 建立區域性元件 註冊區域性元件 宣告元件 元件中的按鈕 button div template src node modules vue dist vue.min.js script 建立區域性元件 const mybutton 類似閉包,儲存資料 return let vm newvu...

vue全域性元件和區域性元件

vue元件包括兩種 1 全域性元件,2 區域性元件 區域性元件var 變數名字一定要放在new vue例項外面 1 全域性元件 text align center color red font size 20px margin top 20px 全域性元件直接像上面這樣 註冊 就可以 如果還想註冊繼...

vue全域性元件與區域性元件

vue對元件的定義 元件是可復用的 vue 例項 元件之間是互不影響的,乙個元件的崩潰,並不會影響整個專案的執行。全域性元件 button add button add div src vue.js script 註冊全域性物件,要寫在vue例項的上面 vue.component button ad...