关于element-ui中的dropdown组件的两个坑

一、样式覆盖(记录一下:项目中所有下拉框或者下拉菜单的样式全部被初始化文件里li标签样式覆盖了,目前不明白其中的道理,问题解决了,如果有大佬知道,还望指教小弟一二,谢谢
一般组件样式覆盖可以使用嵌套写在某个盒子里面,但是dropdown不可以,我指的是下拉菜单项的样式,如图:
在这里插入图片描述
比如home页面

<style scoped lang="scss">
.home {
	.main {
		background: pink;
	}
}
// 写在外面
.personalCenter {
  /deep/ .el-dropdown-menu__item {
    width: 90px;
    text-align: center;
  }
}
</style>

不了解的盆友可以去控制台调式看看,下拉的菜单的元素处在app下的,不在home里,所以这样写才有效果!

二、下拉菜单项触发事件(文档没细说)

<el-dropdown-menu slot="dropdown" class="personalCenter">
 <el-dropdown-item>基本信息</el-dropdown-item>
  <el-dropdown-item>我的钱包</el-dropdown-item>
  <el-dropdown-item>螺蛳粉</el-dropdown-item>
  <el-dropdown-item @click.native="backLogin">退出</el-dropdown-item>
</el-dropdown-menu>

必须要加.native,不然你啥都看不到。

你不知道的事,我用一生去追寻

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值