目錄結構

前言

一、安裝

#二、配置成可以自己使用的後台模板

三、新增自己的後台模組

四、關於資料庫設計

五、請求介面回傳403

六、解決清單頁顯示的是分類ID而不是分類名稱

七、為什麼添加和修改都不管用了？

八、清單欄位顯示的為英文

九、如何在一個範本上設定按鈕，然後顯示設定的表格

#十、關於資料庫欄位設定為state查詢條件沒用

十一、設定的enum類型頁面怎麼是下拉框，不是單選框

十二、發起ajax成功後如何實現刷新資料

#前言

本文會對fastadmin進行簡單安裝和配置，並且對fastadmin在使用過程中遇到的問題全程記錄。

如你也有相關的問題，那麼就評論區見

一、安裝

下載網址：https://www.fastadmin.net/download.html?ref=docs

喀喀爾這裡使用的使用原始碼安裝方式，比較方便。

點選上邊的下載位址，然後下載來源碼包，進行解壓縮。

然後將解壓縮的檔案放置到PHP環境目錄中。

配置phpstudy虛擬網域。

這裡一定要注意你的PHP環境。

「
PHP >= 7.1 且 = 5.5.0 (需支援innodb引擎) Apache 或 Nginx PDO PHP Extension MBstring PHP Extension CURL PHP Extension Node.fastadmin入門必備教程 (可選,用於安裝Bower和LESS,同時打包壓縮也需要使用到) Composer (可選,用於管理第三方擴充包) Bower (可選,用於管理前端資源) Less (可選,用於編輯less檔,如果你需要增改css樣式,最好安裝上)
”

##這裡咔咔配置的地址是

www.fast.com.

然後直接造訪

www.fast.com/install.php即可

接下來就是填寫一些資料庫資訊即可。

安裝成功的後台樣子。

這裡你可以看到上邊有一個小提示，這個提示在安裝成功後的後台存取目錄是一串自動產生的目錄。

就是因為咔咔將目錄位址改為admin然後給的提示。

這裡將admin改為fastadmin，在來看一下。

這樣就可以正常的使用了。

二、配置成可以自己使用的後台模板

#可以根據上邊的這個圖來看，選單中有很多都是不需要的，接下來就刪除。

舉例刪除外掛程式管理的這一個選單。

刪除程式碼裡邊所有關於外掛程式的程式碼，這裡的位址可以在瀏覽器中看到

然後在後台的選單管理中，將外掛程式的這個選項刪除掉即可。

其餘的選單都是一樣的，由於這個外掛程式的是沒有表的，所以就沒有涉及到表結構刪除。

三、新增自己的後台模組

#建立一級檔案：php think crud -t picture -u 1

建立一個二級資料夾：php think crud -t video -c video/video -u 1

建立駝峰的檔案：php think crud -t video_subject -c video/videoSubject -u 1

刪除二級檔案目錄：php think crud -t picture -d picture/picture -u 1

四、關於資料庫設計

#使用圖片上傳功能

image smallimage varchar 識別為圖片文件，自動產生可上傳圖片的元件,單圖

images smallimages varchar 識別為圖片文件，自動產生可上傳圖片的元件,多圖

createtime 建立時間 int 記錄新增時間欄位,不需要手動維護

updatetime 更新時間 int 記錄更新時間的欄位,不需要手動維護

text 文字型自動產生textarea文字方塊

##weigh 權重 int 後台的排序字段，如果存在該字段將出現排序按鈕，可上下拖動進行排序

#五、請求接口返回403

將以下程式碼加入api基類別即可

<span style="display: block; background: url(https://files.mdnice.com/user/3441/876cad08-0422-409d-bb5a-08afec5da8ee.svg); height: 30px; width: 100%; background-size: 40px; background-repeat: no-repeat; background-color: #282c34; margin-bottom: -7px; border-radius: 5px; background-position: 10px 10px;"></span><code class="hlfastadmin入門必備教程" style="overflow-x: auto; padding: 16px; color: #abb2bf; display: -webkit-box; font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; font-size: 12px; -webkit-overflow-scrolling: touch; padding-top: 15px; background: #282c34; border-radius: 5px;">header(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"Access-Control-Allow-Methods: *"</span>);<br/>header(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;Access-Control-Allow-Origin: 域名&#39;</span>);<br/>header(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"access-control-allow-credentials: true"</span>);<br/><span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">// 响应头设置</span><br/><span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">// header(&#39;Access-Control-Allow-Headers:x-requested-with,Content-Type,X-CSRF-Token&#39;);</span><br/><span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">if</span> ($_SERVER[<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;REQUEST_METHOD&#39;</span>] == <span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;OPTIONS&#39;</span>){<br/>    <span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">// 浏览器页面ajax跨域请求会请求2次，</span><br/>    <span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">// 第一次会发送OPTIONS预请求,不进行处理，直接exit返回，</span><br/>    <span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">// 但因为下次发送真正的请求头部有带token，</span><br/>    <span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">// 所以这里设置允许下次请求头带token否者下次请求无法成功</span><br/>    header(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;Access-Control-Allow-Headers:x-requested-with,content-type,token,userid,laravelsession&#39;</span>);<br/>    <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">exit</span>(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"ok"</span>);<br/>}<br/></code>

登入後複製

然後將跨網域偵測註解掉

#2、解決清單頁顯示的是分類ID而不是分類名稱

#其實這個問題很好解決，不要想的太複雜。

你可以試想一下在thinkphp框架是怎麼解決這個問題的。

在thinkphp中解決這個問題就是使用獲取器來處理的。

只需要在對應的模型中設定獲取器。

頁面顯示

但是真的是這樣處理的嗎？不要一看數據出來了，就萬事大吉了。

你可以思考一下，在index頁面沒有顯示出分類的名字，但在修改時卻出現了名字。

那麼是不是可以得出的結論為首頁沒有使用獲取器，而add、edit頁面使用了獲取器。

若依照上邊的方法，直接暴力的在模型中加入獲取器，會造成一個非常嚴重的問題，那就是修改會無法顯示資料。不信你可以試試看。

就跟下圖一樣，這不是鬧玩呢木。

所以說這種方案肯定不行。

试想一下，在thinkphp框架中，除了fastadmin入門必備教程可以表字段处理外，同样使用fastadmin入門必備教程也可以。当然用最原始的fastadmin入門必備教程on方法也是可以的。

在fastadmin中，控制器的方法都继承于application/admin/library/traits/Backend.php这个文件中。

在这个文件中可以看到fastadmin入門必備教程

那只能做的一件事情就是在需要显示分类名称的控制器中重写这个方法index呗！

在重写之前需要做的一件事情就是需要在对应的模型中写上fastadmin入門必備教程

然后在你需要的控制器上fastadmin入門必備教程

源码

<span style="display: block; background: url(https://files.mdnice.com/user/3441/876cad08-0422-409d-bb5a-08afec5da8ee.svg); height: 30px; width: 100%; background-size: 40px; background-repeat: no-repeat; background-color: #282c34; margin-bottom: -7px; border-radius: 5px; background-position: 10px 10px;"></span><code class="hlfastadmin入門必備教程" style="overflow-x: auto; padding: 16px; color: #abb2bf; display: -webkit-box; font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; font-size: 12px; -webkit-overflow-scrolling: touch; padding-top: 15px; background: #282c34; border-radius: 5px;">    <span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">/**<br/>     * 查看<br/>     */</span><br/>    <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">public</span> <span class="hlfastadmin入門必備教程-function" style="line-height: 26px;"><span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">function</span> <span class="hlfastadmin入門必備教程-title" style="color: #61aeee; line-height: 26px;">index</span><span class="hlfastadmin入門必備教程-params" style="line-height: 26px;">()</span><br/>    </span>{<br/>        <span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">//设置过滤方法</span><br/>        <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">$this</span>->request->filter([<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;strip_tags&#39;</span>, <span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;trim&#39;</span>]);<br/>        <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">if</span> (<span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">$this</span>->request->isAjax()) {<br/>            <span class="hlfastadmin入門必備教程-comment" style="color: #5c6370; font-style: italic; line-height: 26px;">//如果发送的来源是Selectpage，则转发到Selectpage</span><br/>            <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">if</span> (<span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">$this</span>->request->request(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;keyField&#39;</span>)) {<br/>                <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">return</span> <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">$this</span>->selectpage();<br/>            }<br/>            <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">list</span>($where, $sort, $order, $offset, $limit) = <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">$this</span>->buildparams();<br/><br/>            $list = <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">$this</span>->model<br/>                ->with(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;category&#39;</span>)<br/>                ->where($where)<br/>                ->order($sort, $order)<br/>                ->paginate($limit);<br/>            $result = <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">array</span>(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"total"</span> => $list->total(), <span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"rows"</span> => $list->items());<br/><br/>            <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">return</span> fastadmin入門必備教程on($result);<br/>        }<br/>        <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">return</span> <span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">$this</span>->view->fetch();<br/>    }<br/></code>

登入後複製

到这里可并没有万事大吉啊！还需要修改模板，在对应的fastadmin入門必備教程文件中添加即可

<span style="display: block; background: url(https://files.mdnice.com/user/3441/876cad08-0422-409d-bb5a-08afec5da8ee.svg); height: 30px; width: 100%; background-size: 40px; background-repeat: no-repeat; background-color: #282c34; margin-bottom: -7px; border-radius: 5px; background-position: 10px 10px;"></span><code class="hlfastadmin入門必備教程" style="overflow-x: auto; padding: 16px; color: #abb2bf; display: -webkit-box; font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; font-size: 12px; -webkit-overflow-scrolling: touch; padding-top: 15px; background: #282c34; border-radius: 5px;">{field: <span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;category.name&#39;</span>, title: __(<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">&#39;分类名称&#39;</span>), formatter:Table.api.formatter.search},<br/></code>

登入後複製

fastadmin入門必備教程中说是还需要设置属性设置属性protected $relationSearch = true;，反正咔咔测试设置不设置都一样，你们看着来，目前还没发现这个参数到底是控制什么的。官方fastadmin入門必備教程说是控制开启关联查询，但是经测试，好像没什么大碍。

来看一下fastadmin入門必備教程吧！

如果只是一对一那解决方案会有很多种。

你可以使用fastadmin入門必備教程on来直接查询，同样你也可以循环查询出来的数据，然后根据每个分类ID进行查询出对应的分类名即可。

七、为什么添加和修改都不管用了？

这里的问题首先去看看数据库的表结构，看你的表结构是否有问题。

表结构不要设置为field_id结尾，这样的字段是不可以的。

直接暴力就是fieldId即可。

关于这块后期看一下fastadmin源码，看是不是后缀带id的都会做什么操作。

经过看源码得出的结论。

fastadmin在一键curd时会将后缀为_id的字段识别为表外键，在新增记录时无论填入任何值都和报错“xxx_id不能为空”，这是因为fastadmin将其识别为了外键在add.html语句中这个字段的input是这样的：

<span style="display: block; background: url(https://files.mdnice.com/user/3441/876cad08-0422-409d-bb5a-08afec5da8ee.svg); height: 30px; width: 100%; background-size: 40px; background-repeat: no-repeat; background-color: #282c34; margin-bottom: -7px; border-radius: 5px; background-position: 10px 10px;"></span><code class="hlfastadmin入門必備教程" style="overflow-x: auto; padding: 16px; color: #abb2bf; display: -webkit-box; font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; font-size: 12px; -webkit-overflow-scrolling: touch; padding-top: 15px; background: #282c34; border-radius: 5px;"><input id=<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"c-xxx_id"</span> data-rule=<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"required"</span> data-source=<span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"xxx/index"</span> <span class="hlfastadmin入門必備教程-class" style="line-height: 26px;"><span class="hlfastadmin入門必備教程-keyword" style="color: #c678dd; line-height: 26px;">class</span>="<span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">form</span>-<span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">control</span> <span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">selectpage</span>" <span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">data</span>-<span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">field</span>="<span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">name</span>" <span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">name</span>="<span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">row</span>[<span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">xxx_id</span>]" <span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">type</span>="<span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">text</span>" <span class="hlfastadmin入門必備教程-title" style="color: #e6c07b; line-height: 26px;">value</span>=""><br/><br/></span></code>

登入後複製

八、列表字段显示的为英文

这个问题就很简单了，咔咔没有看源码理解就是语言包没有你设置的这个字段名。

直接打开到对应的fastadmin入門必備教程文件，然后修改初始化表格中的title值即可。

修改完之后就可以看到中文名了。

九、如何在一个模板上fastadmin入門必備教程，然后显示设置的表格

先看实现效果，点击回收站之后弹出一个表格。

那么如何给自己需要的模板设置同样的效果呢？

接下来就使用官方给的案例进行解读。

首先来到test的index模板中可以看到回收站的这个按钮。

这里需要注意这个herf的值，如果是自己自定义的按钮直接把title替换成自己设置的名字即可。

接著來到test的fastadmin入門必備教程模板，在這個fastadmin入門必備教程中你能看到出了index初始化表格外，還有一個 recyclebin這個方法。

如果你不想寫直接把這個方法拿過去即可，但一定要修改url位址哈！

但此時所做的這些修改遠遠還是不夠的，還需要控制器，那麼test的recyclebin#的這個方法是在application/admin/library/traits/Backend.php這個檔案裡邊。

如果你想設定你自己的方法，那麼你需要在控制器新增加一個方法，然後把這個檔案中的fastadmin入門必備教程程式碼複製過來即可。

既然有了控制器，有了fastadmin入門必備教程創建了表格，那還缺少什麼呢！

還缺一個模板嘍！建立一個跟你的方法名稱一樣的html文件，然後隨便複製一個index.fastadmin入門必備教程進去。

在複製的時候只留下這些程式碼，其餘的就可以刪除了，咔咔測試如果加上上邊的程式碼會出現無法存取的情況。

html檔名的設定就跟下圖一樣

做完這些工作那就可以看到你想要的東西了。

實作步驟

在控制器Test中寫入需要顯示清單的方法，例如display方法
#建立了控制器就需要建立跟display方法對應的display.html範本檔案
#html範本檔案的建立位置是在Test目錄下
找到Test的fastadmin入門必備教程文件，然後加入display方法，這個方法不會寫的話就直接使用案例中test.fastadmin入門必備教程中的recyclebin
# #然後就大功告成了

如果你還不會那麼就只能私訊咔咔了，哈哈

這裡有個注意點就是如果你是用的test .fastadmin入門必備教程方法中的

recyclebin，那麼會存在一個問題就是操作的按鈕問題。

這個按鈕就是在

recyclebin的初始化表格中設定的，自行設定即可。

也就是換換classname和名字即可。

修改完後的圖，只要細心這個框架使用起來還是非常順手的。

十、关于fastadmin入門必備教程设置为state查询条件没用

如果你发现你对state这个字段设置where条件后没有效果时，试着查询一条数据，然后看一下这个state类型

<span style="display: block; background: url(https://files.mdnice.com/user/3441/876cad08-0422-409d-bb5a-08afec5da8ee.svg); height: 30px; width: 100%; background-size: 40px; background-repeat: no-repeat; background-color: #282c34; margin-bottom: -7px; border-radius: 5px; background-position: 10px 10px;"></span><code class="hlfastadmin入門必備教程" style="overflow-x: auto; padding: 16px; color: #abb2bf; display: -webkit-box; font-family: Operator Mono, Consolas, Monaco, Menlo, monospace; font-size: 12px; -webkit-overflow-scrolling: touch; padding-top: 15px; background: #282c34; border-radius: 5px;">string(<span class="hlfastadmin入門必備教程-number" style="color: #d19a66; line-height: 26px;">1</span>) <span class="hlfastadmin入門必備教程-string" style="color: #98c379; line-height: 26px;">"1"</span><br/></code>

登入後複製

如果类型是上边打印的结果，那么你就要注意了，在查询条件中需要写上"1" ，也就是字符串1，而非整型1。

看到这里是不是恍然大悟，赶紧去改你的查询条件吧！