web-dev-qa-db-ja.com

エラーwithRefは削除されました。ラップされたインスタンスにアクセスするには、Redux Formを使用するときに接続コンポーネントのrefを使用します

Redux Formを初めて動作させようとすると、次のエラーが表示されます。

Invariant Violation withRefは削除されました。ラップされたインスタンスにアクセスするには、接続されたコンポーネントの参照を使用します。

何が間違っていますか？このエラーは、ストアを作成（例からコピー/貼り付け）するとすぐにスローされます。

これがコードです。

import React from "react";
import ReactDOM from "react-dom";
import { createStore, combineReducers } from 'redux'
import { reducer as formReducer } from 'redux-form'

const rootReducer = combineReducers({
  form: formReducer
})

const store = createStore(rootReducer);


function App() {
  return (
    <div className="App">
      <h1>Hello CodeSandbox</h1>
      <h2>Start editing to see some magic happen!</h2>
    </div>
  );
}

const rootElement = document.getElementById("root");
ReactDOM.render(<App />, rootElement);

また、問題を示すコードサンドボックスを作成しました。 https://codesandbox.io/s/07xzolv6

reactjsreduxredux-form
16
Mimo

Redux-formの最新バージョン（8.1.0）に更新するだけです。ダウングレードする必要はありません。

13
Bamtak

同じ問題がありました。どうやらredux-formは、react-redux version 6以降ではまだうまく機能しません。

私にとって助けになったのはreact-reduxパッケージをバージョン5にダウングレードすることです

npm install [email protected] --save
18
Yariv Katz

上記は機能しますが、最新のものを使用したい場合は、関数コンポーネントをクラスコンポーネントにリファクタリングするだけです。 withRef() AP​​Iを探します。 （他の開発者を支援する正しい答えとしてこれを支持してください。）

https://redux-form.com/7.1.2/docs/api/fieldarray.md/#props-you-can-pass-to-code-fieldarray-code-

4
Clayton Ray

https://github.com/reduxjs/react-redux/releases/tag/v6.0.

接続するwithRefオプションがforwardRefに置き換えられました

export default 
  connect(
    mapStateToProps,
    mapDispatchToProps, null, {forwardRef: true})(Component)
0
Muhammad Numan

ダウングレードすることはお勧めしませんreact-redux代わりに、両方のライブラリを最新バージョンに更新し、問題を修正する必要があると言います。 v6からv8への移行に関するRedux Formのドキュメントを参照してください。

https://redux-form.com/8.2.2/docs/MigrationGuide.md

0
John Kennedy