关于$emit子组件调用父组件方法

getLineChar() {
      getLineChartApi(new Date().getTime()).then(response => {
        this.daySize = response.data.daySize
        this.initChart()
        console.log(response)
        this.$emit('handlePushLineChartData', response.data)
      })
    },

这里调用父组件的指定发方法的时候发现无法调用,确定方法名无误的话,要确认父类组件中是否把父组件注册为可调用;

 <panel-group @handleSetLineChartData="handlePushLineChartData" />
 <需要绑定的组件文件名称或者你绑定的名称 @子组件中调用父组件的方法="父组件中被调用的方法" />

引入组件:

首先在components: { } 中引引入组件
然后使用 <组件名称 />(或者使用前端的命名规则)就可以使用组件,在其中可以使用
代码:chart-data="lineChartData"绑定数据
使用@handleSetLineChartData="handlePushLineChartData"绑定子类调用通道

还有一点需要注意,。当调用父组件方法的时候,可以传递值,

this.$emit('alertMsg2', res)

res便是你的值,而在方法中就可以这样拿到参数了

alertMsg2(res) {
      console.log(res)
      let msgType = 'success'
      if (!res.flag) {
        msgType = 'error'
      }

但是千万有一点要注意,在父组件调用子组件那里。不是要绑定方法吗?
那里千万别顺手把参数给加了,直接调用就好了,参数自然会过去。加了反而取不到,,如果加了。参数反而会去取本组件内的参数,要么取错要么取不到;
错误的写法

<RightDrawer ref="drawer" 
:user-id="row.id" @refreshList="refreshList" @alertMsg2="alertMsg2(res)"/>

正确的写法

<RightDrawer ref="drawer" :user-id="row.id" @refreshList="refreshList" @alertMsg2="alertMsg2"/>

补充
this.$parent可以调用父组件的data中的数据以及methods中的方法;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值