vue的例項化有以下幾種形式:
new
vue(}}
)
export
default
}}
vue檔案由三個部分組成:元件、指令碼、樣式即template、script、style
>
>
>
}h1>
type
="text"
v-model
="content"
v-on:keyup.enter
="keycont()"
/>
>
v-for
="item in items"
v-bind:class=""
v-on:click
="finlishbed(item)"
>
}li>
ul>
div>
template
>
>
import storage from
'./storage'
export
default},
methods:
this
.items.
push()
;this
.content ='';
},finlishbed:
function
(item)},
watch:
, deep:
true}}
}script
>
>
.shbed
style
>
關鍵字:component
>
>
>
component-a
>
div>
template
>
>
import componenta from './components/componenta'
export default
},components:
}>
註冊元件後可以直接在父級元件中引用。方式是標籤的方式,如元件:componenta引入至父元件就以元件名的標籤的形式展現。
關鍵字:props、$emit
父向子傳值(動態)
v-bind:chilname
="this.cont"
>
component-a
>
(父vue檔案)//chilname作為傳遞資料的屬性
type
="text"
v-model
="content"
v-on:keyup.enter
="keycont()"
/>
(父vue檔案)
>
(父vue檔案)
import storage from
'./storage'
import componenta from
'./components/componenta'
export
default},
methods:
this
.items.
push()
;this
.cont =
this
.content;
//將文字框中的值傳入到cont欄位裡
this
.content ='';
},finlishbed:
function
(item)},
watch:
, deep:
true}}
, components:
}script
>
>
(子vue檔案)
export
default},
props:
['chilname'],
//子元件接收來自父元件的資料屬性
watch:
, deep:
true
//深度監聽}}
, methods:}}
script
>
props用來接收來自父元件的資料,關聯到子元件的屬性:chilname,通過v-bind實現動態繫結.
this.cont的值來自於this.content。this.content的值與父vue裡的input通過v-model繫結關聯.可以實現聯動繫結。將content的值傳入cont最後傳到子元件輸出到控制台.
子向父傳值(動態)
"this.cont" v-on:context=
"convert"
>
<
/component-a>(父vue檔案)
(父vue檔案)
methods:
this
.items.
push()
;this
.cont =
this
.content;
this
.content ='';
},finlishbed:
function
(item)
, convert:
function
(msg))}
//通過convert來監聽來自子元件的資料},
"text" v-model=
"msg" v-on:keyup.enter=
"modclick()"
>(子vue檔案)
(子vue檔案)
export
default},
props:
['chilname'],
watch:
, deep:
true}}
, methods:}}
<
/script>
v-on:屬性名=「監聽方法」(父vue檔案)
$emit(父元件的繫結屬性,資料)(子vue檔案)
Vue筆記,持續更新
在mounted函式裡,通過this.ref和document.queryselector都訪問不了dom vue文件裡關於ref的觸發時機說明 cn.vuejs.org v2 api inde 關於 ref 註冊時間的重要說明 因為 ref 本身是作為渲染結果被建立的,在初始渲染的時候你不能訪問它...
Vue 開發學習 持續更新
import user from components users 註冊vue.components users users 類似這樣 元件引入 import toasttitle from components toasttitle index import vue from vue 註冊全域性元...
指標學習筆記(持續更新)
question 1.什麼是指標?2.指標與引用的異同?何時使用指標,何時使用引用?1.c 提供兩種字串 string類物件和c風格的基於指標的char 字串。2.常量指標自身不可改變,而指向的目標可以改變。使用const修飾指標 指向非常量資料的非常量指標 如 int ptr 應用 間接引用指標使...