标签: react-admin

在登录之前和之后使用捆绑包拆分 react-admin 应用程序的代码

考虑如下所示的 react-admin 应用程序。我打算代码分离的方式,在一切都'./posts''./users'在用户登录之后才加载。

我计划使用我可以使用的动态 import() 语法,以便webpack 自动开始对应用程序进行代码拆分

我看到的问题是所有应用程序组件都是使用应用程序的定义导入的。在东西的动态导入'./posts',并'./users'因为它是在应用程序本身的进口也不会分裂。

如何设置和拆分此代码库,以便只有在用户登录后才加载'./posts''./users'加载内容?

import React, { Component } from 'react';
import { Admin, Resource } from 'react-admin';
import { Login } from 'ra-ui-materialui';
import { authProvider, dataProvider, i18nProvider } from './providers';
// vvv - to be loaded after the user has logged in 
import { PostList, PostEdit, PostCreate, PostIcon } from './posts';
import { UserList, UserEdit, …
Run Code Online (Sandbox Code Playgroud)

dynamic-import reactjs code-splitting react-admin

5
推荐指数
1
解决办法
926
查看次数

多对多关系 react-admin

我试着在表明Datagrid一个Field是一个多对多的关系(中间表)。

我有这些表:

组 - group_subject - 主题

  • 一个小组可以有很多科目
  • 一个主题可以连接多个组

group_subject 也有属性,如评分细则和日程表

这是一个多对多的关系。我想在<Resource> group一个组所连接的所有主题中显示。

使用类似<SingleFieldList>: 作为这个图像

我正在使用react-admin. 有没有办法在这种关系中获得价值?

admin-on-rest react-admin

5
推荐指数
1
解决办法
3108
查看次数

如何获取 SimpleFormIterator 的索引

我想访问 simpleFormIterator 的索引。我怎样才能做到这一点?我有一个类似的代码,我试图在 SelectInput 组件中访问它

<ArrayInput source='services'>
    <SimpleFormIterator>
        <TextInput source='id' label="Service Name" validate={this.RequiredAndRegex} />
        <FormDataConsumer>
            {({ formData, ...rest }) => 
                <ArrayInput source='parametervalues'>
                    <SimpleFormIterator>
                        <TextInput source='id' label="Parameter Values" validate={this.RequiredAndRegex} />
                        <SelectInput label="Paramater Type"
                            source="id"
                            choices={this.getParameters(formData.services[index].servicetype)}
                            optionText={optionRenderer}
                            optionValue="id" />
                    </SimpleFormIterator>
                </ArrayInput>
            }
        </FormDataConsumer>
    </SimpleFormIterator>
</ArrayInput>
Run Code Online (Sandbox Code Playgroud)

admin-on-rest react-admin

5
推荐指数
1
解决办法
1896
查看次数

在react-admin中成功验证后如何重定向到其他路由

我一直在寻找一种解决方案,在react-admin中成功验证后重定向到特定的url,

当我粘贴http://localhost:1234/#/students/sdf2343afs32到网址上时(如果已登录),我将获得用户详细信息页面,但如果未登录,则在登录后会显示主页

react-admin

5
推荐指数
1
解决办法
6046
查看次数

React-admin 登录页面中的更多字段

我需要在登录页面中再插入一个字段,因此,在 JSON 登录请求中插入另一个条目,尽管我设法在登录页面中插入该字段(作为带有FormControls 的Select字段),但在插入时遇到了麻烦将所选选项添加到 JSON 请求中。

login.js:

import React, { Component } from 'react';
import PropTypes from 'prop-types';
import { propTypes, reduxForm, Field } from 'redux-form';
import { connect } from 'react-redux';
import compose from 'recompose/compose';

import Avatar from '@material-ui/core/Avatar';
import Button from '@material-ui/core/Button';
import Card from '@material-ui/core/Card';
import CardActions from '@material-ui/core/CardActions';
import CircularProgress from '@material-ui/core/CircularProgress';
import TextField from '@material-ui/core/TextField';
import { withStyles } from '@material-ui/core/styles';
import LockIcon from '@material-ui/icons/Lock';
import { MenuItem, Select, FormControl, …
Run Code Online (Sandbox Code Playgroud)

reactjs react-redux react-admin

5
推荐指数
0
解决办法
1651
查看次数

React-admin:如何将更多参数传递给 GET_LIST 类型的 dataProvider

我想将一个自定义参数传递给管理员的 dataProvider,类型为“GET_LIST”。

我在 App.js 中有这样的东西:

<Admin dataProvider={dataProvider}> 
    <Resource name="posts" list={PostList} myCustomAttr={"10"} /> 
    <Resource name="users" list={UserList} myCustomAttr={"15"} /> 
</Admin>
Run Code Online (Sandbox Code Playgroud)

“dataProvider”是一个自定义 dataProvider,我希望在调用它时拥有“myCustomAttr”。

所以我的自定义 dataProvider 可能如下所示:

export default (type, resource, params) => {

    if (type == 'GET_LIST') {
       if (params.myCustomAttr == '10') {
           //Do something
       }
    }
}
Run Code Online (Sandbox Code Playgroud)

parameters dataprovider reactjs react-admin

5
推荐指数
1
解决办法
5423
查看次数

如何从左侧菜单折叠开始

是否可以轻松地从折叠的左侧菜单开始,或者我是否需要更新布局?我希望默认情况下折叠菜单,仅显示图标。谢谢。

react-admin

5
推荐指数
2
解决办法
2692
查看次数

如何使用React Admin进行本地排序和过滤?

我使用 React-Admin 创建了一个仪表板,在该应用程序中,当我尝试根据特定列对表进行排序时,会向后端发出获取请求,并且查询字符串与 URL 一起传递,目前我的后端未设置为读取查询字符串数据,当我尝试使用某些文本进行搜索时,会发生同样的情况,向后端发出请求,并且搜索字符串与查询字符串一起发送。我想做的是找到一种在本地排序或过滤的方法,而不向后端发出任何请求。希望这是可能的,如果有人能给我建议一种前进的方式。

sorting filter react-admin

5
推荐指数
0
解决办法
303
查看次数

对 'GET_LIST' 的响应必须类似于 { data : [...] },但接收到的数据不是数组

我正在尝试使用ra-data-simple-rest 数据提供程序

import React from 'react';
import { Admin, fetchUtils, Resource } from 'react-admin';
import simpleRestProvider from 'ra-data-simple-rest';
import { PostList } from './Posts';

const dataProvider = simpleRestProvider('http://localhost:8000');

const App = () => (
    <Admin dataProvider={dataProvider}>
        <Resource name="posts" list={PostList} />
    </Admin>
);

export default App;
Run Code Online (Sandbox Code Playgroud)

react-admin 监听http://localhost:3000/#/posts

Api 正在运行:http://localhost:8000/posts返回响应为。

$response = new JsonResponse($output);
$response->headers->set('Content-Range', 'posts 0-0/5');
$response->headers->set('Access-Control-Expose-Headers', 'Content-Range');
$response->headers->set('Access-Control-Allow-Origin', '*');
$response->headers->set("Access-Control-Allow-Headers", "Content-Type, Accept, X-Requested-With");
Run Code Online (Sandbox Code Playgroud)

它返回一些东西

{
    "data": [
        {
            "id": "1",
            "title": "Hello world",
            "body": …
Run Code Online (Sandbox Code Playgroud)

react-admin

5
推荐指数
1
解决办法
3723
查看次数

react-admin 创建一个可以从侧边菜单访问的自定义页面

我是 react-admin 的新手,如何创建可以从侧边菜单访问的自定义页面?我正在寻找类似于本教程:https : //marmelab.com/blog/2019/03/07/react-admin-advanced-recipes-user-profile.html但我需要能够访问它与其他资源一样,来自左侧菜单侧栏中的图标的个人资料页面。谢谢

reactjs react-admin

5
推荐指数
1
解决办法
2122
查看次数