ElementUI+el-dropdown函数触发事件

最近使用element想实现一下效果，当点击下拉框时会触发事件填充数据,然后显示数据，但是当点击下拉框的时候怎么也触发不了函数。
官网的写法：
在trigger属性设置为click即可。除了使用假数据，从后台获取数据我从来没有运行成功过….

<el-col :span="12"><span class="demonstration">click 激活</span><el-dropdown trigger="click"><span class="el-dropdown-link">下拉菜单<i class="el-icon-arrow-down el-icon--right"></i></span><el-dropdown-menu slot="dropdown"><el-dropdown-item>黄金糕</el-dropdown-item><el-dropdown-item>狮子头</el-dropdown-item><el-dropdown-item>螺蛳粉</el-dropdown-item><el-dropdown-item>双皮奶</el-dropdown-item><el-dropdown-item>蚵仔煎</el-dropdown-item></el-dropdown-menu></el-dropdown></el-col>

我的方式：@click.native=”函数”>，完美解决问题（网上找来的…）

 <el-dropdown  trigger="click" @click.native="getChild(cate.nodeId)"><span class="el-dropdown-link">{{cate.categoryName}}<i class="el-icon-arrow-down el-icon--right"></i></span><el-dropdown-menu slot="dropdown"><el-dropdown-item v-for="child in childList" v-text="child.categoryName" >面板</el-dropdown-item></el-dropdown-menu></el-dropdown>

js代码：

 getChild:function (childId) {for(var i in app.cateList){if(app.cateList[i].parentId == childId && app.childList.indexOf(app.cateList[i]) == -1){app.childList.push(app.cateList[i]);}}}

注：如果在el-dropdown 里面设置了trigger=”click”属性，即为该控件在点击的时候出现数据。如果没有设置该属性，则ElementUI默认为鼠标悬浮事件hover 激活。如果数据在页面写成假数据，那完全没有问题，当鼠标悬停的时候会显示数据。但是如果数据是从后台取到的并且设置的是click事件这里就有一个问题，即：我的是点击才触发函数，当没点击的时候，鼠标悬停在控件上面（此时是没有数据的）会显示出一个”>”的图标。所以在设置为click的时候，虽然设置了trigger=”click”属性也还是触发不了事件，当然还是设置的好。

ElementUI+el-dropdown函数触发事件相关推荐

onsubmit函数触发事件
今天调试js时遇见一问题,form的onsubmit属性中的方法在提交时没反应?于是直接Google了解onsubmit方法的触发事件,总结如下: onsubmit属性的触发必须是在form中用inp ...
vue elementui el-select通过@Change触发事件
@Change="getSyncImgRepoListOption" <el-select v-model="formData.srcRepoProjs" ...
java弹窗触发事件_关于ElementUI中MessageBox弹框的取消键盘触发事件(enter,esc)关闭弹窗(执行事件)的解决方法...
好久没见了在项目中遇到一个小小的需求,总结了一下! 详细我就不介绍了,相信大家用过的话,很了解.详见文档-----------> http://element-cn.eleme.io/#/zh ...
关于ElementUI中MessageBox弹框的取消键盘触发事件(enter,esc)关闭弹窗(执行事件)的解决方法...
好久没见了在项目中遇到一个小小的需求,总结了一下! 详细我就不介绍了,相信大家用过的话,很了解.详见文档-----------> http://element-cn.eleme.io/#/zh ...
关于ElementUI中MessageBox弹框的取消键盘触发事件(enter,esc)关闭弹窗(执行事件)的解决方法
关于ElementUI中MessageBox弹框的取消键盘触发事件(enter,esc)关闭弹窗(执行事件)的解决方法参考文章: (1)关于ElementUI中MessageBox弹框的取消键盘触发 ...
vue elementUI表单输入完成后回车触发事件@keyup.enter.native
<el-form-item label="源仓库namespace:"><el-input v-model=" ...
获取触发事件的元素的ID
有什么方法可以获取触发事件的元素的ID? 我在想类似的东西: <html><head><script type="text/javascript" s ...
在C#中使用代理的方式触发事件
事件(event)是一个非常重要的概念,我们的程序时刻都在触发和接收着各种事件:鼠标点击事件,键盘事件,以及处理操作系统的各种事件.所谓事件就是由某个对象发出的消息.比如用户按下了某个按钮,某个文件发 ...
js中函数,方法,事件对比区分，什么是方法，什么是函数
微信小程序开发交流qq群 581478349 承接微信小程序开发.扫码加微信. 正文: 简单的理解:函数是运行在本地的,方法是公用的. 事件是开关,通过某某事件触发某个函数通常命名规范 ...

ElementUI+el-dropdown函数触发事件

ElementUI+el-dropdown函数触发事件相关推荐

最新文章

热门文章