解決vue視圖不渲染


 動態添加對象屬性

//聲明
var travelMainVueObj;
travelMainVueObj = new Vue({ "el" : "#portletContent", "data" : { checkBudgetData: {}//預算檢查 } });

//使用 js部分
                            var checkBudgetText = "";
                            var checkBudgetFlag = "1"; //1代表 預算執行控制檢查通過; 2代表違反柔性;
                            var checkBudgetObject = {};
                            if(noPassSize == 0 ){
                                //預算執行控制檢查通過
                                checkBudgetText  = "預算執行控制檢查通過";
                                checkBudgetFlag = "1";
                            }else{
                                //有N條違反柔性,待查看
                                checkBudgetText = "有 "+ noPassSize +" 個違反柔性 待查看";
                                checkBudgetFlag = "2";
                            }
                            
                            Vue.set(travelMainVueObj.checkBudgetData,"checkBudgetResult",checkBudgetText);
                            Vue.set(travelMainVueObj.checkBudgetData,"checkBudgetFlag",checkBudgetFlag);



//使用 html部分
                                <div class="rowContent">
                                    <span class="pass" id="checkBudgetResultPass" v-if="checkBudgetData.checkBudgetFlag == '1'">
                                        {{checkBudgetData.checkBudgetResult}}
                                    </span>
                                    <span class="reject" id="checkBudgetResultReject" v-else-if="checkBudgetData.checkBudgetFlag == '2'">
                                        {{checkBudgetData.checkBudgetResult}}
                                    </span>
                                </div>
語法:
Vue.set(更新vue的對象或者數組,"key的名字",key的值);
Vue.set()在methods中也可以寫成this.$set()


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM