前端:renderer渲染方法的几种常见用法

这篇博客介绍了前端数据的转义处理,通过示例展示了如何根据数据值动态渲染按钮,并提供了一个天气预警的逻辑处理案例。内容包括:1.数据转义,用于安全展示敏感信息;2.行内按钮元素的添加,实现查阅和修改功能;3.根据特定条件进行实时逻辑处理,例如高温预警展示。这些技术增强了前端数据的展示与交互性。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.对数据进行转义处理

eg:加载时执行该方法进行转义后再展示

<div name="is_test" field="is_test" width="100" headerAlign="center" allowSort="true" align="center" renderer="escape">是否测试</div>
/* 前端是否字段转义*/
function escape(e) {
	if(e.value==0){
		return '否';
	}else {
		return '是';
	}
}

2.在每个数据行增加按钮元素

eg:适用于需要在每行增加查阅、修改等功能按钮时

<div width="70" renderer="onEditrender" headerAlign="center" align="center">操作</div>
function onEditrender(e){
	 var record = e.record; 
	 var id = record.id;
	 var  s ='';
	 s = '<a class="Edit_Button" href="javascript:view(\''+id+'\');" >查阅</a>  <a class="Edit_Button" href="javascript:edit(\''+id+'\');" >修改</a>';   
     return s;
}

3.进行一些加载实时的逻辑处理,类似1,比如根据该行数据的某个值或某几个值做一些结果展示。

eg:当天气为晴,温度高于35℃,且为工作日时显示高温预警。

评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值