需求:將方法中內容對齊
實現方式
- 給for循環中每個方法添加一個動態的id
- 在DOM結果渲染完后,更新頁面數據,否則會報錯,找不到對應節點或對應節點為空
<view v-for="(item, index) in itemList" :key="index"><view class="cards-cell" v-if="item.MEMO"><view class="card-label w60">方法</view><view class="card-value" :id="`MEMO${index}`"> {{ item.MEMO }} </view></view>
</view>
調用接口,獲取到數據后,使用this.$nextTick
this.$nextTick(() => {this.changeMemo()
})changeMemo() {
for (var i = 0; i < this.itemList.length; i++) {if (this.itemList[i].MEMO) {var element = document.getElementById(`MEMO${i}`);if (element) {element.innerHTML = this.itemList[i].MEMO.replace(/ /g, '<br/>');}else{console.log('該元素不存在:');}}}
},