fastadmin 动态下拉组件 SelectPage

很酷的站长

发布于 2022-12-16 21:27:16

3.3K0

发布于 2022-12-16 21:27:16

文章被收录于专栏：站长的编程笔记

FastAdmin 中的动态下拉列表使用的是优秀强大的 Selectpage 插件，FastAdmin 对其进行了二次开发

这个插件适合用于下拉框数据较多时，比如: 发布文章时选择哪个用户发布的。并且支持下拉多选，非常实用

基础用法: 给表单元素的 class 添加一个 selectpage，然后再添加一个 data-source 属性提供数据源

<input id="c-name" class="form-control selectpage" data-source="category/selectpage">

data-source 支持 Object 和 远程URL 返回两种方式，如：

// Object
data-source='[{"id":"1","name":"标题1"},{"id":"2","name":"标题2"}]'
// 远程URL
data-source="category/selectpage"

当使用 远程URL 的方式时需要远程返回 JSON 数据，如：

// 其中 list 为数据列表, total 为总记录数，总记录数将用于前端显示分页使用
{"list":[{"id":1,"name":"admin"},{"id":2,"name":"liang"}],"total":30}

Selectpage 列表中显示字段默认是 name，主键字段默认是 id

<!-- data-field 自定义显示字段、data-primary-key 自定义主键字段 -->
<input data-source="category/selectpage" data-field="title" data-primary-key="value">

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自作者个人站点/博客前往查看

如有侵权，请联系 cloudcommunity@tencent.com 删除。

本文参与腾讯云自媒体同步曝光计划，欢迎热爱写作的你一起参与！

登录后参与评论

0 条评论

热度