在使用bootstrap table時可能在很多時候回用的表格來顯示數據,如果自己寫那肯定沒問題,但是數據展示出來就麻煩多了,然而bootstrap table 封裝了一套完善的數據表格組件,把從後台請求的數據很容易就展示出來了,bootstrap table有兩種實現方式,一種是通過table寫定在html裡面,另一種是通過js實現,js實現比較靈活,所以這裡採用js方式,下面來看實現。
推薦教程:Bootstrap圖文教程
客戶端
必須先引入相應的css、js等文件
服務端:只需在接到請求時返回json數組就行了,是json數組哦,不是單個對象,不然就數據展示不出來。
注意bootstrap table 可以前端分頁也可以後端分頁,這裡我們使用的是後端分頁,後端分頁時需返回含有
total:總記錄數 這個鍵值好像是固定的,我看文檔沒找到可以修改成別的
rows: 記錄集合 鍵值可以修改 dataField 自己定義成自己想要的就好
但是這可能會有請求時數據賦值不了的情況,那時你就會幹著急了,下面還可以使用如下方式進行數據渲染。這個效果和上面一個不一樣,這裡就不上圖了。同樣第一步要引入官網所要求的的css/js等文件。
會使用之後是不是覺得比自己寫的table更好用多了,還不用寫一大堆js和div等,還有更多功能可以去官網了解怎麼使用。
以上就是bootstrap table輕鬆實現數據表格的詳細內容,更多請關注其它相關文章!