直接在element的时间轴组件el-timeline-item上挂在点击事件是不生效的,只有点击在连接线的位置才能触发,这是因为在点击过程中,可能点击到的是el-timeline-item的子元素,比如el-timeline-item__timestamp is-bottom"></div>元素
解决方法:在click上面加上修饰符.native
<el-timeline>
<el-timeline-item
v-for="(activity, index) in activities"
:key="index"
:icon="activity.icon"
:type="activity.type"
:color="activity.color"
:size="activity.size"
:timestamp="activity.timestamp"
@click.native="handleChangeVideo(activity)"
>
<div>{{ activity.content }}</div>
</el-timeline-item>
</el-timeline>
官方对.native修饰符的解释为:
有时候,你可能想在某个组件的根元素上监听一个原生事件。可以使用 v-on 的修饰符 .native 。例如:
1 |
|
记录一下自己的傻缺操作,明明一句话就能搞定,费了老鼻子劲,哈哈^_^