Tushan后臺管理應(yīng)用前端框架
Tushan 是一個自由度極高的，基于React的，開箱即用的后臺管理應(yīng)用前端框架。
作為開發(fā)者, 你可以像是調(diào)用庫一樣快速創(chuàng)建一個可用的后臺管理框架
一個簡單的Tushan 應(yīng)用大概會長成以下樣子:
import {
createTextField,
createEmailField,
createUrlField,
jsonServerProvider,
ListTable,
Resource,
Tushan,
} from 'tushan';
const dataProvider = jsonServerProvider('https://jsonplaceholder.typicode.com');
function App() {
return (
<Tushan
basename="/admin"
dataProvider={dataProvider}
>
<Resource
name="users"
label="User"
list={
<ListTable
fields={[
createTextField('id', {
label: 'ID',
}),
createTextField('name', {
label: 'Name',
list: {
sort: true,
},
}),
createEmailField('email', {
label: 'Email',
}),
createUrlField('website', {
label: 'Website',
}),
]}
action={{ create: true, detail: true, edit: true, delete: true }}
/>
}
/>
</Tushan>
);
}
export default App;
我們可以通過指定字段的類型來決定數(shù)據(jù)表格的表現(xiàn)形式，并且內(nèi)置實現(xiàn)了常規(guī)的增刪改查等操作。幫助開發(fā)者快速產(chǎn)出一個后端應(yīng)用的 MVP。
預(yù)覽?
預(yù)覽效果如下:
Tushan 的 api 設(shè)計受到 react-admin 很大的啟發(fā)，兩者的接口協(xié)議是完全兼容的，這意味著react-admin現(xiàn)成的后端接口生態(tài)方案可以完全無縫被 Tushan 使用。如果對 material-ui 設(shè)計的后臺方案感興趣的話可以選擇 react-admin 作為替代
另外，Tushan 還包括一些常用的前端依賴項，如 styled-components 和 arco-design 等 ，可以幫助您更快地搭建前端界面。
在 CodeSandbox 中快速示例?
訪問 CodeSandbox 快速獲得無后臺版本的示例程序。
UI框架?
Tushan 的UI組件庫是基于字節(jié)跳動的 arco-design。你可以在這里訪問arco-design的官方文檔
所有的組件都已經(jīng)被導(dǎo)出且可以通過tushan直接引入
評論
圖片
表情