el-date-picker给父组件传值的问题

来源:6-8 销售趋势组件容器+头部开发(下)

慕慕1545788

2020-09-11

如何讲el-date-picker组件里的日期字符串传给父组件?
我看到老师的代码里有这样的配置:

<el-date-picker
                                type="daterange"
                                v-model="date"
                                range-separator="-"
                                start-placeholder="开始日期"
                                end-placeholder="结束日期"
                                size="small"
                                unlink-panels
                                :picker-options="pickerOptions"
                                class="sensor-view-date-picker"
                        />

并且看到了老师的代码里有传值的语句:

 onClick(picker) {
                            const start =new Date()
                            const end =new Date()
                            picker.$emit('pick',[start,end],true)
        
                        }

所以我在父组件里试图监听上面那段代码中 picker.$emit(‘pick’,[start,end],true)传的值但是失败了。请问老师应该怎么做?

写回答

1回答

扬_灵

2020-09-11

同学你好,在项目中这里的picker表示的是那个日期组件的元素,而不是我们组件的实例,你可以在这里打印一下就知道了,如果想要把日期字符串传递给父组件可以从父组件那边接收一个方法在子组件中监听日期组件值得变化,当子组件的值发生变化的时候通过this.$emit(‘xxx’,data)这种方式传递过去。如果不能解决你的问题,可以继续追问。


0
4
扬_灵
回复
慕慕1545788
项目中的picker.$emit('pick',[start,end],true)这是调用日期组件的pick方法,"picker并不是当前实例的this"是指picker表示的是日期对象而不是vue的实例,你在methods中创建一下方法然后在onClick中调用一下看看方法是否执行。如果不能执行就表示在onClick中this的指向是日期对象,如果函数执行,你把代码上传一下,我在本地帮你看一下项目中传值的问题。
2020-09-15
共4条回复

数据可视化入门到精通-打造前端差异化竞争力

同级别前端,掌握数据可视化薪资更高

1525 学习 · 1043 问题

查看课程