react-admin:既存の属性が事前に入力されていない編集フォーム

ザラスシュトラ

最近、react-adminを発見しましたすべてが順調に見えますが、解決策が見つからないという問題が発生しました。

既存のレコードを編集する場合、すべての入力フィールドは空です。空のフォームを送信すると、すべての属性が「無効」になります。

これは私のコードです:

// src/users.js
export const UserEdit = (props) => (
  <Edit title="Edit User" {...props}>
    <SimpleForm>
      <DisabledInput label="Id" source="id" />
      <TextInput source="first_name" />
      <TextInput source="last_name" />
    </SimpleForm>
  </Edit>
);

// App.js
const restClient = jsonAPIRestClient("http://localhost:3000/admin");

const App = () => (
  <Admin dataProvider={restClient}>
    <Resource name="users" list={UserList} edit={UserEdit}/>
  </Admin>
);

データアダプタには、を使用していjsonAPIRestClientます。レコードはすべてreduxストアに保存され、利用できます。

興味深いのは、aでDisabledInputあるIDがフォームに表示されていることです。

何が足りないのですか?

編集:

package.json

{
  "name": "admin",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "aor-jsonapi-client": "^0.2.0",
    "prop-types": "^15.6.2",
    "react": "^16.5.0",
    "react-admin": "^2.3.0",
    "react-dom": "^16.5.0",
    "react-scripts": "1.1.5"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  }
}

編集2:ユーザー属性が約の編集ページの入力フィールドにあることがわかりました。1/10秒。その後、フィールドがクリアされますか?!

編集3:これがこのバグにつながるreduxアクションです:

RA/CRUD_GET_ONE_SUCCESS ここに画像の説明を入力してください

したがって、ここで問題が発生しているのは、フェッチされた単一のリソースをreduxストアに誤って保存するデータプロバイダーだと思います。これは正しいです?

編集4:残念ながら、データプロバイダーが悪いようです。リポジトリは現在メンテナンスされていないようです。この問題を解決することを目的としたPRがあります。

https://github.com/moonlight-labs/aor-jsonapi-client/pull/6

ザラスシュトラ

代替jsonapiクライアント

https://github.com/henvo/ra-jsonapi-clientで、別の動作中のreact-adminjsonapiクライアントを見つけました

一緒にインストールすることができます:

npm install ra-jsonapi-client

この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。

侵害の場合は、連絡してくださいdebugcn@gmail.com

編集
0

コメントを追加

0

関連記事

分類Dev

編集フォームのReactの入力フィールドに既存の値を入力する方法

分類Dev

Reactフォーム:入力データが表示されない

分類Dev

フェッチされたデータが入力されていないReactフォーム

分類Dev

React:入力値がフォームで定義されていません

分類Dev

redux-formでreact-testing-libraryを使用してもフォーム入力が変更されない

分類Dev

フォーム送信時にReactフォームの値が表示されない

分類Dev

attrのreactIDが原因で入力フィールドが編集できない場合の入力フィールドとReact

分類Dev

フォームデータが小道具としてフォームに渡されると、入力のあるカスタムウィジェットはreact-jsonschema-formでフォーカスを失います

分類Dev

入力が編集されているのに、フォームが$ dirtyに設定されていません

分類Dev

React-選択がフォーカスされていない場合、選択入力の内容は消えます

分類Dev

事前入力されたデータをユーザー入力と比較し、編集されている場合にのみフォームを送信します

分類Dev

React:入力の状態を空の配列に設定することにより、フォーム入力が状態からクリアされないことを検索します

分類Dev

Reactフォームの送信値が定義されていないのはなぜですか?

分類Dev

React-Admin:MenuItemLinkを2回クリックすると、フォーム入力がクリアされます

分類Dev

Meteor React フォームに既存のデータを入力する

分類Dev

React&Redux:「フォームが接続されていないため、フォームの送信がキャンセルされました」

分類Dev

制御されていない入力Reactフック

分類Dev

Reactフォームが送信されないのはなぜですか?

分類Dev

[React-Context]:フォーム検証エラーが最初に表示されない

分類Dev

React-「e」と「data」が宣言されているが使用されていないため、フォームは空のデータを送信していますか?

分類Dev

Reactフォームの入力タイプ番号を更新しています

分類Dev

Reactアプリ内にTextFieldフォームが表示されない

分類Dev

Reactのボタンクリックでフォームが入力されていることを確認するにはどうすればよいですか?

分類Dev

React Adminで表示ビューからダイアログにフォーム入力を追加するにはどうすればよいですか?

分類Dev

入力時にReactのフォーカスが解除された入力フィールド

分類Dev

Reactでフォームの送信イベントを手動でトリガーしても、必要な入力がチェックされません

分類Dev

事前入力されていないフォームAngular8

分類Dev

React入力フィールドが正しく機能していないことに基づいて無効化されたボタン

分類Dev

react-final-form状態に空の入力が含まれていない

Related 関連記事

  1. 1

    編集フォームのReactの入力フィールドに既存の値を入力する方法

  2. 2

    Reactフォーム:入力データが表示されない

  3. 3

    フェッチされたデータが入力されていないReactフォーム

  4. 4

    React:入力値がフォームで定義されていません

  5. 5

    redux-formでreact-testing-libraryを使用してもフォーム入力が変更されない

  6. 6

    フォーム送信時にReactフォームの値が表示されない

  7. 7

    attrのreactIDが原因で入力フィールドが編集できない場合の入力フィールドとReact

  8. 8

    フォームデータが小道具としてフォームに渡されると、入力のあるカスタムウィジェットはreact-jsonschema-formでフォーカスを失います

  9. 9

    入力が編集されているのに、フォームが$ dirtyに設定されていません

  10. 10

    React-選択がフォーカスされていない場合、選択入力の内容は消えます

  11. 11

    事前入力されたデータをユーザー入力と比較し、編集されている場合にのみフォームを送信します

  12. 12

    React:入力の状態を空の配列に設定することにより、フォーム入力が状態からクリアされないことを検索します

  13. 13

    Reactフォームの送信値が定義されていないのはなぜですか?

  14. 14

    React-Admin:MenuItemLinkを2回クリックすると、フォーム入力がクリアされます

  15. 15

    Meteor React フォームに既存のデータを入力する

  16. 16

    React&Redux:「フォームが接続されていないため、フォームの送信がキャンセルされました」

  17. 17

    制御されていない入力Reactフック

  18. 18

    Reactフォームが送信されないのはなぜですか?

  19. 19

    [React-Context]:フォーム検証エラーが最初に表示されない

  20. 20

    React-「e」と「data」が宣言されているが使用されていないため、フォームは空のデータを送信していますか?

  21. 21

    Reactフォームの入力タイプ番号を更新しています

  22. 22

    Reactアプリ内にTextFieldフォームが表示されない

  23. 23

    Reactのボタンクリックでフォームが入力されていることを確認するにはどうすればよいですか?

  24. 24

    React Adminで表示ビューからダイアログにフォーム入力を追加するにはどうすればよいですか?

  25. 25

    入力時にReactのフォーカスが解除された入力フィールド

  26. 26

    Reactでフォームの送信イベントを手動でトリガーしても、必要な入力がチェックされません

  27. 27

    事前入力されていないフォームAngular8

  28. 28

    React入力フィールドが正しく機能していないことに基づいて無効化されたボタン

  29. 29

    react-final-form状態に空の入力が含まれていない

ホットタグ

アーカイブ