[TOC] #### 1. 前言 --- FastAdmin 中的動態(tài)下拉列表使用的是優(yōu)秀強大的 [Selectpage](https://terryz.github.io/selectpage/index.html "Selectpage") 插件，F(xiàn)astAdmin 對其進行了二次開發(fā) 這個插件適合用于下拉框數(shù)據(jù)較多時，比如: 發(fā)布文章時選擇哪個用戶發(fā)布的。并且支持下拉多選，非常實用 更多用法參考 [FastAdmin 官方文檔](https://doc.fastadmin.net/doc/178.html) #### 2. 常規(guī)用法 --- 基礎(chǔ)用法: 給表單元素的 class 添加一個 `selectpage`，然后再添加一個 `data-source` 屬性提供數(shù)據(jù)源 ```html <input id="c-name" class="form-control selectpage" data-source="category/selectpage"> ```  #### 3. 常用屬性 --- | 屬性 | 功能 | | ------------ | ------------ | | data-source | 提供數(shù)據(jù)源的 URL 地址或 JSON 數(shù)據(jù) | | data-field | 自定義顯示字段，默認(rèn)為 name | | data-primary-key | 自定義主鍵字段，默認(rèn)為 id | | data-params | 自定義擴展參數(shù) | #### 4. 數(shù)據(jù)源 --- `data-source` 支持 `Object` 和 `遠程URL` 返回兩種方式，如： ``` // Object data-source='[{"id":"1","name":"標(biāo)題1"},{"id":"2","name":"標(biāo)題2"}]' // 遠程URL data-source="category/selectpage" ``` 當(dāng)使用 `遠程URL` 的方式時需要遠程返回 JSON 數(shù)據(jù)，如： ```json // 其中 list 為數(shù)據(jù)列表, total 為總記錄數(shù)，總記錄數(shù)將用于前端顯示分頁使用 {"list":[{"id":1,"name":"admin"},{"id":2,"name":"liang"}],"total":30} ``` `Selectpage` 列表中顯示字段默認(rèn)是 `name`，主鍵字段默認(rèn)是 `id` ```html <!-- data-field 自定義顯示字段、data-primary-key 自定義主鍵字段 --> <input data-source="category/selectpage" data-field="title" data-primary-key="value"> ```