利用動態:class來判斷字長調整選項卡uni-data-select?寬度

//html
<view><view style="width:100%" :class="checkLength(text)>4 ? 'textexplode':''textshrink"><uni-data-select v-model="value" :localdata="rangeTag" @change="changeStyleTag" :clear="false"></uni-data-select></view>
</view>//data
// Tag選項卡
value: 0, // 默認index當前索引
rangeTag: [{ value: 0, text: "xxxxxxx" },{ value: 1, text: "xxx" },],
text: '',// 首次加載頁面
onLoad () {this.rangeTag.map(v => {if (this.value == v.value) {this.text = v.text}})},methods: {// 選項卡點擊事件changeStyleTag (e) {//console.log('changeStyleTag', e)this.rangeTag.map(v => {if (e == v.value) {this.text = v.text}})//console.log(this.text, 'this.text');},/*** 獲取字符串字節長度* @param {String}* @returns {Boolean}*/checkLength (v) {const realLength = v.length;//console.log(v.length);return realLength;},}//css
// 寬度擴展
.textexplode {width: 100%;
}
// 寬度收縮
.textshrink {min-width: 65%;
}

?