结合 ThinkPHP6 框架特性和前端 JS 的规范性、安全性,对代码进行以下改进(包含 TP6 适配、XSS 防护、语法优化、鲁棒性提升等):
TP6 中json_encode建议添加JSON_UNESCAPED_UNICODE(避免中文转义)和JSON_HEX_TAG(防止 XSS)参数,确保数据安全传递:
// 控制器中传递数据(示例)
View::assign('stores', $storeList); // $storeList为查询到的店铺列表
// 模板中输出JSON(TP6推荐写法)
var stores = {:json_encode($stores, JSON_UNESCAPED_UNICODE | JSON_HEX_TAG)};
// 1. 鲁棒性校验:确保数据存在且为数组
const stores = {:json_encode($stores, JSON_UNESCAPED_UNICODE | JSON_HEX_TAG)} || [];
let html = '';
// 2. XSS防护工具函数(避免用户输入内容导致XSS)
const escapeHtml = (str) => {
if (!str) return '';
return str.replace(/&/g, '&')
.replace(/</g, '<')
.replace(/>/g, '>')
.replace(/"/g, '"')
.replace(/'/g, ''');
};
// 3. 构建HTML(模板字符串+forEach循环,更简洁安全)
html += '<div>';
html += '<select name="store_id[]" lay-filter="tar_storeId" class="store_id">';
// 用forEach循环(比for...in更安全,避免原型链污染)
stores.forEach(store => {
// 4. 语义化判断选中状态
const isSelected = store.id === 2 ? 'selected' : '';
// 5. 转义内容防止XSS
const escapedTitle = escapeHtml(store.title);
html += `<option value="${escapedTitle}" ${isSelected}>${escapedTitle}${store.id}</option>`;
});
html += '</select>';
html += '</div>';
- 确保 TP6 控制器中传递的
$stores是数组格式(而非对象),若为对象可通过toArray()转换(如模型查询结果:$storeList = StoreModel::select()->toArray(););