uni-app 子組件如何調用父組件的方法

1.在父組件methods中定義一個方法:html

changeType:function(type){
    this.typeActive = type;
    alert(type);
}

2.在父組件引用子組件時綁定該方法:this

<cate-top :catelist="catelist"  v-on:pChangeType="changeType"></cate-top>

3.在子組件中綁定點擊事件:spa

<template name="cate-top">
    <view class="activity-cover">
        <view class="up-mode">
            <view class="li" v-for="(item,index) in types" :key="index"  @tap="changeType(item.cate)">
                <text>{{item.name}}</text>
            </view>
        </view>
    </view>
</template>

點擊事件爲 code

@tap="changeType(item.cate)"

4.在子組件 methods 中點擊事件中,使用 $emit 調用父組件的changeType()方法:htm

changeType:function(type){
    this.$emit("pChangeType")
},

傳參數:blog

changeType:function(type){
    this.$emit("pChangeType",type)
},

子組件中第一個參數是父組件中調用子組件並傳遞方法須要綁定的方法名,第二個參數是須要傳遞的參數。事件

轉載時請註明出處及相應連接,本文永久地址:http://www.javashuo.com/article/p-fcmczlft-cd.html,謝謝!get

相關文章
相關標籤/搜索