可以使用 Layui 的 template 模块来动态加载选项，如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Layui 动态模板示例</title>
<link rel="stylesheet" href="path/to/your/layui/css/layui.css">
<script src="path/to/your/layui/layui.js"></script>
</head>
<body>
<div class="layui-input-inline">
<select name="moduleId" lay-filter="moduleId">
<option value="">请选择模块</option>
</select>
</div><script>
layui.use(['admin', 'form'], function () {
var $ = layui.$,
form = layui.form,
admin = layui.admin;
// 加载模块列表
admin.req({
url: '/api/security/module/list?pageNumber=1&pageSize=10000',
dataType: 'json',
success: function (r) {
var options = '';
layui.each(r.body.rows, function (index, item) {
options +='<option value="' + item.id + '">' + item.name + '</option>';
});
// 渲染选项
$('select[name="moduleId"]').html(options);
form.render('select'); // 重新渲染 select 组件
}
});
// 监听 select 组件的 change 事件
layui.form.on('select(moduleId)', function (data) {
console.log('选中的值为：', data.value);
});
});
</script>
</body>
</html>
在这个示例中，我们首先定义了一个 select 组件，并使用 Layui 的 admin.req 方法来动态加载选项。然后，我们使用 jQuery 将选项插入到 select组件中，并使用form.render(‘select’)方法重新渲染select` 组件。
请注意，您需要根据您的实际需求修改 URL 和数据处理逻辑。同时，您还可以使用其他 Layui 组件和方法来实现更复杂的功能。
