diff --git a/src/ConnectedField.js b/src/ConnectedField.js index d39bce4fc..6ef6edb3d 100644 --- a/src/ConnectedField.js +++ b/src/ConnectedField.js @@ -336,7 +336,7 @@ const createConnectedField = (structure: Structure<*, *>) => { }, undefined, undefined, - { withRef: true } + { forwardRef: true } ) return connector(ConnectedField) } diff --git a/src/ConnectedFieldArray.js b/src/ConnectedFieldArray.js index 939ab249a..89cb46b1d 100644 --- a/src/ConnectedFieldArray.js +++ b/src/ConnectedFieldArray.js @@ -197,7 +197,7 @@ const createConnectedFieldArray = (structure: Structure<*, *>) => { ) }, undefined, - { withRef: true } + { forwardRef: true } ) return connector(ConnectedFieldArray) } diff --git a/src/ConnectedFields.js b/src/ConnectedFields.js index 68e883a1e..33d5ad63c 100644 --- a/src/ConnectedFields.js +++ b/src/ConnectedFields.js @@ -207,7 +207,7 @@ const createConnectedFields = (structure: Structure<*, *>) => { }, undefined, undefined, - { withRef: true } + { forwardRef: true } ) return connector(ConnectedFields) } diff --git a/src/__tests__/reduxForm.spec.js b/src/__tests__/reduxForm.spec.js index 9f235895f..dd326e90e 100644 --- a/src/__tests__/reduxForm.spec.js +++ b/src/__tests__/reduxForm.spec.js @@ -1958,7 +1958,11 @@ const describeReduxForm = (name, structure, combineReducers, setup) => { formRender(this.props) return (
- + ) @@ -2010,10 +2014,9 @@ const describeReduxForm = (name, structure, combineReducers, setup) => { expect(deepFooInputRender).toHaveBeenCalled() expect(deepFooInputRender).toHaveBeenCalledTimes(1) - + expect(helloInputRender).toHaveBeenCalled() expect(helloInputRender).toHaveBeenCalledTimes(1) - // Reinitialize the form const initButton = TestUtils.findRenderedDOMComponentWithTag( @@ -2073,7 +2076,11 @@ const describeReduxForm = (name, structure, combineReducers, setup) => { formRender(this.props) return (
- + ) @@ -2129,7 +2136,6 @@ const describeReduxForm = (name, structure, combineReducers, setup) => { expect(helloInputRender).toHaveBeenCalled() expect(helloInputRender).toHaveBeenCalledTimes(1) - // Reinitialize the form const initButton = TestUtils.findRenderedDOMComponentWithTag( dom, @@ -4826,7 +4832,7 @@ const describeReduxForm = (name, structure, combineReducers, setup) => { const decorated = TestUtils.findRenderedComponentWithType(dom, Decorated) - expect(decorated.ref.getWrappedInstance().getFieldList()).toEqual([]) + expect(decorated.ref.getFieldList()).toEqual([]) }) it('should set autofilled and unset it on change', () => { diff --git a/src/createField.js b/src/createField.js index 8a5cdd10c..c166c18e3 100644 --- a/src/createField.js +++ b/src/createField.js @@ -83,9 +83,7 @@ const createField = (structure: Structure<*, *>) => { 'If you want to access getRenderedComponent(), ' + 'you must specify a withRef prop to Field' ) - return this.ref - ? this.ref.getWrappedInstance().getRenderedComponent() - : undefined + return this.ref ? this.ref.getRenderedComponent() : undefined } get name(): string { @@ -97,11 +95,11 @@ const createField = (structure: Structure<*, *>) => { } get pristine(): boolean { - return !!(this.ref && this.ref.getWrappedInstance().isPristine()) + return !!(this.ref && this.ref.isPristine()) } get value(): any { - return this.ref && this.ref.getWrappedInstance().getValue() + return this.ref && this.ref.getValue() } normalize = (name: string, value: any): any => { diff --git a/src/createFieldArray.js b/src/createFieldArray.js index afee37cea..0966b5c74 100644 --- a/src/createFieldArray.js +++ b/src/createFieldArray.js @@ -83,15 +83,15 @@ const createFieldArray = (structure: Structure<*, *>) => { } get dirty(): boolean { - return !this.ref || this.ref.getWrappedInstance().dirty + return !this.ref || this.ref.dirty } get pristine(): boolean { - return !!(this.ref && this.ref.getWrappedInstance().pristine) + return !!(this.ref && this.ref.pristine) } get value(): ?(any[]) { - return this.ref ? this.ref.getWrappedInstance().value : undefined + return this.ref ? this.ref.value : undefined } getRenderedComponent() { @@ -100,7 +100,7 @@ const createFieldArray = (structure: Structure<*, *>) => { 'If you want to access getRenderedComponent(), ' + 'you must specify a withRef prop to FieldArray' ) - return this.ref && this.ref.getWrappedInstance().getRenderedComponent() + return this.ref && this.ref.getRenderedComponent() } render() { diff --git a/src/createFields.js b/src/createFields.js index 3c2769f56..d2282ed3b 100644 --- a/src/createFields.js +++ b/src/createFields.js @@ -76,7 +76,7 @@ const createFields = (structure: Structure<*, *>) => { 'If you want to access getRenderedComponent(), ' + 'you must specify a withRef prop to Fields' ) - return this.refs.connected.getWrappedInstance().getRenderedComponent() + return this.refs.connected.getRenderedComponent() } get names(): string[] { @@ -85,7 +85,7 @@ const createFields = (structure: Structure<*, *>) => { } get dirty(): boolean { - return this.refs.connected.getWrappedInstance().isDirty() + return this.refs.connected.isDirty() } get pristine(): boolean { @@ -93,10 +93,7 @@ const createFields = (structure: Structure<*, *>) => { } get values(): Object { - return ( - this.refs.connected && - this.refs.connected.getWrappedInstance().getValues() - ) + return this.refs.connected && this.refs.connected.getValues() } render() { diff --git a/src/createReduxForm.js b/src/createReduxForm.js index 5d6f5c4b0..bd370efac 100755 --- a/src/createReduxForm.js +++ b/src/createReduxForm.js @@ -1096,7 +1096,7 @@ const createReduxForm = (structure: Structure<*, *>) => { return () => computedActions }, undefined, - { withRef: true } + { forwardRef: true } ) const ConnectedForm = hoistStatics(connector(Form), WrappedComponent) ConnectedForm.defaultProps = config @@ -1106,17 +1106,17 @@ const createReduxForm = (structure: Structure<*, *>) => { ref: ?ConnectedComponent
submit() { - return this.ref && this.ref.getWrappedInstance().submit() + return this.ref && this.ref.submit() } reset(): void { if (this.ref) { - this.ref.getWrappedInstance().reset() + this.ref.reset() } } get valid(): boolean { - return !!(this.ref && this.ref.getWrappedInstance().isValid()) + return !!(this.ref && this.ref.isValid()) } get invalid(): boolean { @@ -1124,7 +1124,7 @@ const createReduxForm = (structure: Structure<*, *>) => { } get pristine(): boolean { - return !!(this.ref && this.ref.getWrappedInstance().isPristine()) + return !!(this.ref && this.ref.isPristine()) } get dirty(): boolean { @@ -1132,17 +1132,17 @@ const createReduxForm = (structure: Structure<*, *>) => { } get values(): Values { - return this.ref ? this.ref.getWrappedInstance().getValues() : empty + return this.ref ? this.ref.getValues() : empty } get fieldList(): string[] { // mainly provided for testing - return this.ref ? this.ref.getWrappedInstance().getFieldList() : [] + return this.ref ? this.ref.getFieldList() : [] } get wrappedInstance(): ?Component<*, *> { // for testing - return this.ref && this.ref.getWrappedInstance().wrapped + return this.ref && this.ref.wrapped } render() { diff --git a/src/types.js.flow b/src/types.js.flow index e2dbc5e9f..d5c6dcc3b 100644 --- a/src/types.js.flow +++ b/src/types.js.flow @@ -39,9 +39,8 @@ export type Values = any export type GetFormState = { (state: any): any } export type ConnectedComponent> = { - getWrappedInstance: { (): T }, wrapped: ?React.Component<*, *> -} & React.Component<*, *> +} & T export type Option = { selected: boolean,