考虑如下所示的 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) 我试着在表明Datagrid一个Field是一个多对多的关系(中间表)。
我有这些表:
组 - group_subject - 主题
group_subject 也有属性,如评分细则和日程表
这是一个多对多的关系。我想在<Resource> group一个组所连接的所有主题中显示。
使用类似<SingleFieldList>:
作为这个图像
我正在使用react-admin. 有没有办法在这种关系中获得价值?
我想访问 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)
我一直在寻找一种解决方案,在react-admin中成功验证后重定向到特定的url,
当我粘贴http://localhost:1234/#/students/sdf2343afs32到网址上时(如果已登录),我将获得用户详细信息页面,但如果未登录,则在登录后会显示主页
我需要在登录页面中再插入一个字段,因此,在 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) 我想将一个自定义参数传递给管理员的 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) 我使用 React-Admin 创建了一个仪表板,在该应用程序中,当我尝试根据特定列对表进行排序时,会向后端发出获取请求,并且查询字符串与 URL 一起传递,目前我的后端未设置为读取查询字符串数据,当我尝试使用某些文本进行搜索时,会发生同样的情况,向后端发出请求,并且搜索字符串与查询字符串一起发送。我想做的是找到一种在本地排序或过滤的方法,而不向后端发出任何请求。希望这是可能的,如果有人能给我建议一种前进的方式。
我正在尝试使用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 的新手,如何创建可以从侧边菜单访问的自定义页面?我正在寻找类似于本教程:https : //marmelab.com/blog/2019/03/07/react-admin-advanced-recipes-user-profile.html但我需要能够访问它与其他资源一样,来自左侧菜单侧栏中的图标的个人资料页面。谢谢