react-admin | 易学教程

Custom Routes in react admin

阅读更多关于 Custom Routes in react admin

问题 I have created a custom route <Route path="/course-plan/:plan_id/plan-lesson/:id" render={props => { return <LessonEditPage {...props} resource={'plan-lesson'} record={{planId: props.match.params.plan_id}} /> }} />, LessonEditPage has and Edit component with SimpleForm When I enter this page, I make a request crudGetOne and locally everything is fine, I have and id in my parameters that I use to make request, but when I deploy this code on server, when I enter this page params.id is undefined

Use <List /> on React-Admin dashboard

阅读更多关于 Use on React-Admin dashboard

问题 I'm using react-admin v2.3.2 with a custom dashboard component as shown in the react-admin tutorial. <Admin dashboard={MyDashboard}> <Resource name="incidents ... /> </Admin> Now I'd like to display a list of incidents on my dashboard using the component of react-admin but react-admin complains about missing properties like 'hasEdit'. I simply passed the props of the dashboard component to the List but this does obviously not work: class MyDashboard extends React.Component { constructor(props

In Material UI, How can I override a selector selected component style?

阅读更多关于 In Material UI, How can I override a selector selected component style?

In Material UI, to extend the distance between MuiInputLabel and MuiInput , I have to override the marginTop of label + .MuiInput-formControl . However, createMuiTheme 's override only provide direct override of a Mui Component CSS, such as: createMuiTheme({ overrides: { MuiInput: { formControl: { marginTop: '1.5rem', }, }, } }) How can I do something like: createMuiTheme({ overrides: { 'label+MuiInput': { formControl: { marginTop: '1.5rem', }, }, } }) Thanks... Here's the relevant JSS documentation: https://cssinjs.org/jss-plugin-nested?v=v10.0.0-alpha.10#use--to-reference-selector-of-the

react-admin: changing resource data in store without http request

阅读更多关于 react-admin: changing resource data in store without http request

i need to modify resource data in store: State->admin->resources->Orders->data but without calling http request, like shown in documentation example: // in src/comment/commentActions.js import { UPDATE } from 'react-admin'; export const COMMENT_APPROVE = 'COMMENT_APPROVE'; export const commentApprove = (id, data, basePath) => ({ type: COMMENT_APPROVE, payload: { id, data: { ...data, is_approved: true } }, meta: { resource: 'comments', fetch: UPDATE }, }); is it possible ? Yes, it is possible. However, as we usually handle optimistic behaviours and other niceties, it won't be straightforward.

How can I list data from another endpoint inside show option in react-admin?

阅读更多关于 How can I list data from another endpoint inside show option in react-admin?

问题 React-Admin version: 2.4.0 I have a list with a info of wallets that I can list using this endpoint: http://myHost:8080/api/v1/private/wallets Now I want to show data of the movements of each wallet when I click in the wallet of the list. So, for obtain the data of the movements of the wallet I need to call to another endpoint, sending the get with this format: ${apiUrl}/${resource}/${params.id}/movements For example: http://myHost:8080/api/v1/private/wallets/cd496094-a77a-4e4e-bcd9

Update values of edited inputs

阅读更多关于 Update values of edited inputs

问题 I am using react-admin framework and I am trying to update values of my input dynamically. In my custom component, I have the onChange() method which looks like this: onChange = (value) => { this.setState({ currentForm: this.props.record }); const { updated_src, name, namespace, new_value, existing_value } = value; this.setState({ currentForm: updated_src }); } First I am setting that the state currentForm has the original unedited values that are stored in this.props.record . After that I am

How is the correct way to have multiple dataProviders in react-admin?

阅读更多关于 How is the correct way to have multiple dataProviders in react-admin?

问题 I'm trying to use multiple dataproviders in a react-admin project but I have an error: Warning: Missing translation for key: "dataProvider is not a function" function.console.(anonymous function) @ index.js:1452 I have my App.js like this: import React from 'react'; import { render } from 'react-dom'; import { Admin, Resource } from 'react-admin'; import dataProviders from './service/dataproviders'; import UserList1, from './users1'; import UserList2, from './users2'; const App = () => (

How is the correct way to have multiple dataProviders in react-admin?

阅读更多关于 How is the correct way to have multiple dataProviders in react-admin?

I'm trying to use multiple dataproviders in a react-admin project but I have an error: Warning: Missing translation for key: "dataProvider is not a function" function.console.(anonymous function) @ index.js:1452 I have my App.js like this: import React from 'react'; import { render } from 'react-dom'; import { Admin, Resource } from 'react-admin'; import dataProviders from './service/dataproviders'; import UserList1, from './users1'; import UserList2, from './users2'; const App = () => ( render( <Admin dataProvider={dataProviders}> <Resource name="users1" list={UserList1} /> <Resource name=

Is it possible to have multiple dataProviders in react-admin?

阅读更多关于 Is it possible to have multiple dataProviders in react-admin?

问题 If I have multiple distinct REST API back-ends (separate apps doing separate things), and I want a single UI (react-admin-based) app that is capable of doing CRUD to entities managed by these various back-ends, I'm curious if it's possible to wire up react-admin to do that. I'm imagining that instead of this (single/global dataProvider): const App = () => ( <Admin dataProvider={simpleRestProvider('http://path.to.foo.api')}> <Resource name="foos" list={FooList} /> </Admin> ); we could do

React Admin - Get current value in a form

阅读更多关于 React Admin - Get current value in a form

I am having big troubles getting the "updated" value of a record in an edit form. I always get the initial record values, even though I have an input linked to the right record source, which should update it. Is there an alternative way to get the values of the SimpleForm ? I have a simple edit form : <Edit {...props}> <SimpleForm> <MyEditForm {...props} /> </SimpleForm> </Edit> MyEditForm is as follow: class MyEditForm extends React.Component { componentDidUpdate(prevProps, prevState, snapshot) { console.log(prevProps.record.surface, this.props.record.surface); // <-- here is my problem, both