react-admin+postgrest实现增删改查功能(摆脱接口开发)

前言

大家好 我是歌谣 微信公众号关注前端小歌谣带你加入前端巅峰人才交流群

简介

最近准备用一个新的技术框架去开发页面 据说能又很快的效果

准备工作

postgrest数据库

在这里插入图片描述

react-admin

https://github.com/marmelab/react-admin

新建

``` import React from 'react'

import { Create, SimpleForm, TextInput, DateInput } from 'react-admin'

const OrderCreate = (props: any) => { return ( ) }

export default OrderCreate

```

编辑

``` import React from 'react'

import { Edit, SimpleForm, TextInput, DateInput } from 'react-admin'

const OrderEdit = (props: any) => { return ( )

}

export default OrderEdit

```

查询

``` import React from 'react'

import { List,Datagrid,TextField,EditButton,DeleteButton} from 'react-admin'

const OrderList = (props: any) => { return

}

export default OrderList

```

结果

在这里插入图片描述

主体

<Admin
            dataProvider={dataProvider}
          >
            <Resource name = 't_order' list = {OrderList} create={OrderCreate} edit = {OrderEdit}/>
          </Admin>

总结

这样就实现了只要通过数据库表和前端就完成了管理页面的开发 只需要知道表名即可 这边知识部分代码 我是歌谣 放弃很容易 但是坚持一定很酷

posted @ 2023-07-19 08:38  前端导师歌谣  阅读(30)  评论(0)    收藏  举报  来源