解决el-select多选时，文字过多换行的问题

image.png

网上搜了很多文章，几乎都是单独设置el-select__tags-text的max-width，如果页面有很多不同宽度的el-select就比较麻烦了，下面是通过refs对不同的el-select的max-width进行修改

    
        
    


    methods: {
        selectChange(val, refName) {
            if (Object.prototype.toString.call(val) === '[object Array]') {
                let eleWidth = this.$refs[refName].$el.style.width.slice(0, -2)
                this.$nextTick(() => {
                    let tags = this.$refs[refName].$el.querySelectorAll('.el-tag.el-tag--info .el-select__tags-text')
                    let maxWidth = ''
                    if (tags.length > 1) {
                        maxWidth = Number(eleWidth) * 0.4 + 'px'
                    } else {
                        maxWidth = Number(eleWidth) * 0.6 + 'px'
                    }
                    tags.forEach(node => {
                        node.style.maxWidth = maxWidth
                    })
                })
            }
        }
    }