vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示

vue :class 可以接收 字符串 数组 和 对象 对象里面的key值 根据true或false 显示不显示

​​https://cn.vuejs.org/v2/guide/class-and-style.html​​

html部分 注意:class

<component :is="tagName" :class="classes" :disabled="disabled" @click="handleClickLink" v-bind="tagProps">
        <Icon class="ivu-load-loop" type="ios-loading" v-if="loading"></Icon>
        <Icon :type="icon" :custom="customIcon" v-if="(icon || customIcon) && !loading"></Icon>
        <span v-if="showSlot" ref="slot"><slot></slot></span>
    </component>

代码部分

computed: {
            classes () {
                return [
                    `${prefixCls}`,
                    `${prefixCls}-${this.type}`,
                    {
                        [`${prefixCls}-long`]: this.long,
                        [`${prefixCls}-${this.shape}`]: !!this.shape,
                        [`${prefixCls}-${this.size}`]: this.size !== 'default',
                        [`${prefixCls}-loading`]: this.loading != null && this.loading,
                        [`${prefixCls}-icon-only`]: !this.showSlot && (!!this.icon || !!this.customIcon || this.loading),
                        [`${prefixCls}-ghost`]: this.ghost
                    }
                ];
            },

第一个和第2个 肯定显示 后面对象里面就是true的显示 这个class

false的就不显示这个class

---------------------------------------------
生活的意义并不是与他人争高下，而在于享受努力实现目标的过程，结果是对自己行动的嘉奖。
↑面的话，越看越不痛快，应该这么说：

生活的意义就是你自己知道你要做什么，明确目标。没有目标，后面都是瞎扯！

新博客 ​​​https://www.VuejsDev.com​​ 用于梳理知识点