- 56
- 0
element plus更新svg图标后,我通过如下方案适配现有项目中的icon font(毕竟没有办法要求项目升级icon方案)。<el-button :icon='CustomizedIcon ' />const CustomizedIcon = (props: any) => { return h(`i`, { class: 'xxx_icon' 项目中自定义的icon })}setup() { return { CustomizedIcon :markRaw(CustomizedIcon ) }}现在又有问题了,如果说我需要数据驱动button切换icon,我要怎么做呢。尝试1没有效果:<el-button :icon='dropButtonIcon '/>setup() { const currentIcon = ret('icon1'); iconMap={ icon1: CustomizedIcon1, icon2: CustomizedIcon2 }; const dropButtonIcon = computed(() => iconMap[currentIcon.value]); // const someEvent = () => { currentIcon.value = 'icon2'; } return { dropButtonIcon, someEvent }}尝试2也没有效果:<el-button :icon='currentIcon==="icon1"? CustomizedIcon1:CustomizedIcon2'/>setUp() { return { CustomizedIcon1, CustomizedIcon2, currentIcon }}我应该怎么做呢
0
打赏
收藏
点击回答
- 共 0 条
- 全部回答
-
收了你的心╮ 普通会员 1楼
Element Plus 提供了按需切换自定义 icon 的功能。首先,你需要在 "Element UI" 中设置 "icon" 属性为
true。然后,你可以在组件的类中使用@change事件来切换自定义 icon。以下是一个简单的示例:
```jsx import { Button } from 'element-ui';
class MyButton extends Button { handleClick() { // 当点击按钮时,切换自定义 icon this.$refs.customIcon?.toggle(); } }
export default MyButton; ```
在这个示例中,我们创建了一个名为
MyButton的按钮组件,并在handleClick方法中切换自定义 icon。我们使用ref属性来获取自定义 icon,然后调用toggle方法来切换图标。请注意,这只是一个基本的示例,你可能需要根据你的具体需求来调整代码。例如,你可能需要监听更复杂的事件,或者使用不同的方法来切换图标。
更多回答
网站公告
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部

