解决vue视图不渲染
2024-09-03 08:05:30
动态添加对象属性
//声明
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()
最新文章
- JavaScript对象创建,继承
- 【linux草鞋应用编程系列】_6_ 重定向和VT100编程
- SQL Server 数据库的维护(一)__存储过程(procedure)
- Request.UrlReferrer 使用
- 《DSP using MATLAB》示例Example5.1
- CSS Hack(转)
- [Everyday Mathematics]20150226
- ExtJs内的datefield控件选择日期过后的事件监听select
- 学习redis-安装和基本一些命令
- Effective C++ 条款18
- 中介模式和学习日记Effective C++
- CF 741D. Arpa’s letter-marked tree and Mehrdad’s Dokhtar-kosh paths [dsu on tree 类似点分治]
- Solr使用访问地址控制索引的,删除、创建
- 快速排序的两种实现 -- 种轴partition : 比值partition(更精巧)
- solidity数据位置-memory,storage和calldata
- codeforces gym 101164 K Cutting 字符串hash
- ActiveMQ的学习整理(代码实现PTP,以及Pub/Sub)
- Autofac解耦事件总线
- 人脸识别-关于face_recognition库的安装
- 高级选项更改MathType数学公式样式