首页 > 其他 > 详细

vue 中子组件或者公共组件向上一级传递数据 $emit的使用

时间:2017-07-01 16:42:05      阅读:1412      评论:0      收藏:0      [点我收藏+]

在子组件或者公共组件中,定义一个方法例如

<li @click="selectItem(item)" v-for="item in group.items" class="list-group-item">

  然后在methods中使用

selectItem(item){
        this.$emit(‘select‘,item);
}

$emit中的两个参数的含义是,一个是传递给父组件的方法,一个是传递给父组件方法的参数。

也就是说,父组件通过使用子组件通过$emit传递的方法select及其参数,来得到传递的数据。

并且,父组件直接使用的select方法其实就是自定义方法的用法,触发这种自定义方法就是子组件触发传递$emit的方法,也就是click。

 <ListView @select=‘selectSinger‘ :data="singers"></ListView>

此处select既是子组件通过$emit传递的自定义方法

selectSinger则是父组件接收select所带的参数的方法

selectSinger(singer) {
        this.$router.push({
          path:`/singer/${singer.id}`
        })
 }

参数singer既是子组件$emit所传递的item参数。

 

若是有用并觉得不错,可以赞一个哟

vue 中子组件或者公共组件向上一级传递数据 $emit的使用

原文:http://www.cnblogs.com/zhoujx1066/p/7102716.html

(2)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!