解決vue this.$forceUpdate() 處理頁面刷新問題（v-for循環(huán)值刷新等）
更新時間：2018年07月26日 11:31:31 作者：雪梅零落
這篇文章主要介紹了解決vue this.$forceUpdate() 處理頁面刷新問題（v-for循環(huán)值刷新等），解決方法是使用this.$forceUpdate()強(qiáng)制刷新，文章給大家分享了代碼案例，需要的朋友參考下吧
問題描述：
在使用Vue框架開發(fā)時，在函數(shù)中改變了頁面中的某個值，在函數(shù)中查看是修改成功了，但在頁面中沒有及時刷新改變后的值；
解決：
運(yùn)用 this.$forceUpdate()強(qiáng)制刷新
代碼案例
<Select v-model="carSafeLine.insuranceName" placeholder="請選擇" class="mulisel option-h" filterable clearable :disabled="editstatus" @on-change="selectInsurance"> <Option v-for="item in dataArr" :key="item.code" :value="item.code" :label="item.codename" :disabled="item.disabled"></Option> </Select>
methods: {
selectInsurance(){ //刷新車輛保險可選狀態(tài)
for(var i=0; i<this.dataArr.length; i++){
var flag = false; //默認(rèn)沒有選中
var itemI = this.dataArr[i];
for(var j=0; j<this.form.carInsuranceVOList.length; j++){ //檢測選項(xiàng)是否已被選中過
var itemJ = this.form.carInsuranceVOList[j];
if(itemI.code == itemJ.insuranceName){
flag = true;
break;
}
}
if(flag){
itemI.disabled = true;
}else{
itemI.disabled = false;
}
}
this.$forceUpdate(); //強(qiáng)制刷新，解決頁面不會重新渲染的問題
}
}
總結(jié)
以上所述是小編給大家介紹的解決vue this.$forceUpdate() 處理頁面刷新問題（v-for循環(huán)值刷新等），希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持！
您可能感興趣的文章:
相關(guān)文章
詳解TypeScript+Vue 插件 vue-class-component的使用總結(jié)
這篇文章主要介紹了TypeScript+Vue 插件 vue-class-component的使用總結(jié)，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2019-02-02
Vue-cli Eslint在vscode里代碼自動格式化的方法
本篇文章主要介紹了Vue-cli Eslint在vscode里代碼自動格式化的方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-02-02
vue中多個文件下載實(shí)現(xiàn)打包壓縮下載示例
這篇文章主要為大家介紹了vue中多個文件下載實(shí)現(xiàn)打包壓縮下載的發(fā)發(fā)示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-07-07
Vue 推薦在絕大多數(shù)情況下使用模板來創(chuàng)建你的 HTML。然而在一些場景中，你真的需要 JavaScript 的完全編程的能力。這時你可以用渲染函數(shù)，它比模板更接近編譯器。下面就和小編一起來學(xué)習(xí)下面文章內(nèi)容吧2021-09-09
這篇文章主要介紹了Vue實(shí)現(xiàn)table上下移動功能,結(jié)合實(shí)例形式分析了vue.js針對table表格元素動態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-02-02
使用 Vue 3 的 createApp方法初始化應(yīng)用的基本步驟
createApp 是 Vue 3 引入的全局 API,用于創(chuàng)建一個應(yīng)用實(shí)例,這篇文章主要介紹了如何使用 Vue 3 的 createApp方法初始化應(yīng)用,通過 createApp 方法,我們從 Vue 3 的基本初始化開始,擴(kuò)展到插件的應(yīng)用、多個應(yīng)用實(shí)例的創(chuàng)建等,需要的朋友可以參考下2024-05-05
這篇文章主要介紹了在Vue當(dāng)中同時配置多個路由文件的方法,包含具體代碼，本文分步驟結(jié)合示例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2022-12-12
vue打包上傳服務(wù)器加載提示錯誤Loading chunk {n} failed
這篇文章主要為大家介紹了vue打包上傳服務(wù)器加載提示錯誤Loading chunk {n} failed解決方法,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-08-08
這篇文章主要為大家詳細(xì)介紹了vue+iview動態(tài)渲染表格的相關(guān)資料，具有一定的參考價值，感興趣的小伙伴們可以參考一下2019-03-03
Vue3中簡單實(shí)現(xiàn)動態(tài)添加路由
本文主要介紹了Vue3中簡單實(shí)現(xiàn)動態(tài)添加路由，，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2023-05-05