BIcon 对话框

封装优化

• 默认图标大小，颜色， 是否点击，可点击操作；
• 默认图标库加载处理；

安装注册

import { BIcon } from '@bdp/ui-vue';
Vue.use(BIcon);

基本使用

代码演示

默认Icon图标

图标点击事件
编辑 不可编辑
本地在线

<template>
    默认Icon图标<br/>
    <BIcon type="step-backward"/> 
    <BIcon type="step-forward" title="前进"/>
    <BIcon type="step-forward" size="30"/>
    <br/>图标点击事件<br/>
    <BIcon type="edit" @click="edit">编辑</BIcon>
    <BIcon type="edit" @click="edit" disabled>不可编辑</BIcon>
    <br/>本地在线<br/>
    <BIcon type="edit" :isMyIcon=true :isMyLocal=false  @click="edit"/>
</template>

<script>
export default {
    data() {
        return {
            visible: false
        }
    },
    methods: {
        edit () {
            console.log("点击了编辑")
        },
    }
}
</script>

API

差异

参数	说明	类型	默认值	版本
title	提示标题	stirng	''
type	图标类型	stirng		必填
disabled	是否可点击	boolean	false
color	颜色	string	跟主题色一致
size	大小	number	20
isMyIcon	是否加载自定义icon	boolean	false
isMyLocal	加载自定义icon是否在线或者本地的	boolean	false

封装优化

安装注册

基本使用

API