上一節我們看來父元件使用props屬性向子元件傳值,這一節我們看下子元件如何向父元件通訊傳值
子元件主要使用this.$emit方法和父元件通訊,
下面的示例演示了子元件向父元件傳值
首先子元件中定義單機事件,
vue.component('todo-item', }',
methods:
} })
然後在元件中監聽事件,使用v-on監聽子元件事件
然後在父元件中處理監聽邏輯,這裡處理邏輯在deleventone中
data: ,
methods:
}})
完整**
v-bind:index="index" v-bind:count="item" :key="index"
v-on:delevent="deleventone"
>
自定義元件,元件通訊
在專案開發時,採用元件化得思想開發,搭建專案時,src下有views目錄,一般放頁面級元件,在建立乙個comment目錄來放公共元件,比如頭部元件和底部元件,然後在建立乙個feature目錄來放功能元件,比如輪播元件,上拉載入更多元件,搜尋元件,tabbar元件等,元件提公升專案得開發效率,解決了傳...
Vue 自定義元件
元件 component 是vue.js 最強大的功能。元件可以封裝可重用的 通過傳入物件的不同,實現元件的復用,但元件傳值就成為乙個需要解決的問題。父元件向子元件傳值 元件例項的作用域是孤立的。這意味著不能在子元件的模板內直接引用父元件的資料。要讓子元件使用父元件的資料,我們需要通過子元件的 pr...
Vue 自定義元件
元件 component 是 vue.js 最強大的功能之一。元件可以擴充套件 html 元素,封裝可重用的 在較高層面上,元件是自定義元素,vue.js 的編譯器為它新增特殊功能。在有些情況下,元件也可以表現為用is 特性進行了擴充套件的原生 html 元素。所有的 vue 元件同時也都是 vue...