資訊專(zhuān)欄INFORMATION COLUMN
摘要：項(xiàng)目地址前言結(jié)合日常開(kāi)發(fā)，封裝常用功能，提高開(kāi)發(fā)效率。通用顯示效果支持類(lèi)型類(lèi)型文本鏈接文檔圖片用法相關(guān)屬性屬性參數(shù)說(shuō)明類(lèi)型可選值默認(rèn)值動(dòng)畫(huà)效果的列的配置對(duì)象，更多細(xì)節(jié)請(qǐng)參見(jiàn)列屬性。
項(xiàng)目地址：tbs-ve-template
前言結(jié)合日常開(kāi)發(fā)，封裝常用功能，提高開(kāi)發(fā)效率。讓程序猿兄弟姐妹們也有時(shí)間約約女票，逗逗男票，做做自己想做的事情，不要天天在辦公室造輪子！
1.通用Table
思路類(lèi)似easy-ui的table加載方式
環(huán)境簡(jiǎn)述開(kāi)發(fā)框架:基于vue-admin-template
github:https://github.com/PanJiaChen...
JS 包管理工具: Yarn
安裝方法：https://www.cnblogs.com/xiang...
項(xiàng)目 啟動(dòng):
第一步：yarn install 下載所有依賴(lài)包
第二步：yarn run dev 下載所有依賴(lài)包
第三步：訪問(wèn)http://localhost:9528
說(shuō)明：為了避免代碼過(guò)長(zhǎng)不易瀏覽，講vue代碼與js代碼分開(kāi)編輯。
類(lèi)型：文本 | 鏈接 | 文檔 | 圖片
用法相關(guān)屬性
Table 屬性:
| 參數(shù) | 說(shuō)明 | 類(lèi)型 | 可選值 | 默認(rèn)值 |
|---|---|---|---|---|
| listLoading | 動(dòng)畫(huà)效果 | boolean | — | true |
| columns | table 的列（column）的配置對(duì)象，更多細(xì)節(jié)請(qǐng)參見(jiàn)列（column）屬性。 | array | — | — |
| ui | table顯示效果的配置對(duì)象，更多細(xì)節(jié)請(qǐng)參見(jiàn)列（ui）屬性 | array | — | — |
| data | 顯示數(shù)據(jù)集合，一般從遠(yuǎn)程獲取數(shù)據(jù)后進(jìn)行賦值 | array | — | — |
| page | table分頁(yè)配置對(duì)象，更多細(xì)節(jié)請(qǐng)參見(jiàn)列（page）屬性 | array | — | — |
Table列（Column）屬性:
| 參數(shù) | 說(shuō)明 | 類(lèi)型 | 可選值 | 默認(rèn)值 |
|---|---|---|---|---|
| label | 列的標(biāo)題文本 | string | — | — |
| field | 列的字段名,與data屬性中的名稱(chēng)對(duì)應(yīng) | string | — | — |
| width | 列的寬度 | number | — | — |
| showtype | 列的類(lèi)型，normal：為文本類(lèi)型 | string | normal、http、file、image | normal |
| filter | 過(guò)濾器，類(lèi)似easyui中formatter屬性，用于格式數(shù)據(jù) | string | — | — |
Table樣式（ui）屬性:
| 參數(shù) | 說(shuō)明 | 類(lèi)型 | 可選值 | 默認(rèn)值 |
|---|---|---|---|---|
| tableHeight | Table高 | string、number | — | — |
| tableWidth | Table寬度 | string、number | — | — |
Table分頁(yè)（page）屬性:
| 參數(shù) | 說(shuō)明 | 類(lèi)型 | 可選值 | 默認(rèn)值 |
|---|---|---|---|---|
| total | 總條目數(shù) | number | — | — |
| listQuery | 分頁(yè)參數(shù)，listQuery：{ page：當(dāng)前頁(yè)碼，limit:每頁(yè)條目數(shù) } | number | — | — |
在使用中有任何問(wèn)題，歡迎反饋給我，可以用以下聯(lián)系方式跟我交流
QQ: 375766253
郵件:375766253@qq.com
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/104552.html
摘要：基于這種思路，那留給我們的只有兩步，組件設(shè)計(jì)和數(shù)據(jù)設(shè)計(jì)。關(guān)于組件的相關(guān)邏輯，可能要在文章里面一次性說(shuō)清楚，還是需要費(fèi)很大的精力，不過(guò)希望數(shù)據(jù)驅(qū)動(dòng)的思想能夠讓之前沒(méi)有體會(huì)到這種開(kāi)發(fā)樂(lè)趣的小伙伴們有到新的想法。 在日常開(kāi)發(fā)中，我們肯定不止一次碰到重復(fù)的業(yè)務(wù)代碼，明明功能相似，但總沒(méi)思路去把它封裝成組件。關(guān)于封裝組件，希望這篇文章能帶給大家新的思路，去更高效的完成日常開(kāi)發(fā)。（注：例子都是基于...
摘要：簡(jiǎn)潔直觀強(qiáng)悍的前端開(kāi)發(fā)框架，讓開(kāi)發(fā)更迅速簡(jiǎn)單。是一套基于的前端框架。首個(gè)版本發(fā)布于年金秋，她區(qū)別于那些基于底層的框架，卻并非逆道而行，而是信奉返璞歸真之道。 2017-1209 ZanUI (Vue) 2017-1218 Onsen UI(Vue, React, Angular) 2017-1215 增加 Vuetify, Weex UI, Semantic UI React,ele...
摘要：簡(jiǎn)潔直觀強(qiáng)悍的前端開(kāi)發(fā)框架，讓開(kāi)發(fā)更迅速簡(jiǎn)單。是一套基于的前端框架。首個(gè)版本發(fā)布于年金秋，她區(qū)別于那些基于底層的框架，卻并非逆道而行，而是信奉返璞歸真之道。 2017-1209 ZanUI (Vue) 2017-1218 Onsen UI(Vue, React, Angular) 2017-1215 增加 Vuetify, Weex UI, Semantic UI React,ele...
閱讀 2608·2023-04-25 19:31
閱讀 2331·2021-11-04 16:11
閱讀 2887·2021-10-08 10:05
閱讀 1597·2021-09-30 09:48
閱讀 2426·2019-08-30 15:56
閱讀 2477·2019-08-30 15:56
閱讀 2237·2019-08-30 15:53
閱讀 2343·2019-08-30 15:44
