iview [Feature Request]I wanna to customize the icon component!

hivapdat  于 2022-11-19  发布在  其他
关注(0)|答案(4)|浏览(189)

What problem does this feature solve?

Ionicicon is relatively small, I want to be able to custom increase the icon component!

What does the proposed API look like?

<i :class="classes" :style="styles"></i>
</template>
<script>
    const prefixCls = 'ivu-icon';
    const prefixClsCus = 'ivu-icon-cus';

    export default {
        name: 'Icon',
        props: {
            type: String,
            custom: Boolean,
            size: [Number, String],
            color: String
        },
        computed: {
            classes () {
                if (this.custom) {
                    return `${prefixClsCus} ${prefixClsCus}-${this.type}`;
                } else {
                    return `${prefixCls} ${prefixCls}-${this.type}`;
                }
            },
            styles () {
                let style = {};

                if (this.size) {
                    style['font-size'] = `${this.size}px`;
                }

                if (this.color) {
                    style.color = this.color;
                }

                return style;
            }
        }
    };
</script>

use

<Icon type="checkmark" custom />
uz75evzq

uz75evzq1#

use

<Icon type="wifi" custom/>

after parsing

<i data-v-cbae9986="" class="ivu-icon-cus ivu-icon-cus-wifi"></i>

希望官方加进去 我就不用升级版本来自己编译了!

2nc8po8w

2nc8po8w2#

@myxingke 你升级最新的iview版本了吗 我这边升级新版本之后 后台管理系统的左侧菜单很恶心 点击某个子菜单,会有展开的主菜单自动收起,把iview版本降下来就不会出这种问题.有没有找到什么地方的问题?

xu3bshqb

xu3bshqb3#

@myxingke 亲 你的字体图标文件怎么处理的?想先用你现在的方法解决自己扩展的问题,然后等官方更新。但是不知道你怎么扩展的自定义图标 麻烦了 谢谢

xriantvc

xriantvc4#

@h-wanli 你加我QQ:327056088 验证:瞎想

相关问题