Open abudel opened 7 years ago
Can you try removing line 385 of control-component.js
in RRF, which is:
// ...
if (isNative) return;
// ...
and seeing if focusing works as expected?
Thanks for the quick replay.
I tried but it's not working either.
It fails a couple rows after, when it tries to access to this.node
prop ( it's undefined ).
I think the problem is beacause it can not attach the node when the component is mount:
`attachNode() { const node = findDOMNode && findDOMNode(this);
if (node) this.node = node;
}`
findDOMNode is null because is not supported on RN.
There is another way where i can access to the node?
Thanks
Can you try installing RRF in your React Native from the master
branch? (Let me know if you don't know how to do that) I just pushed a commit that uses findNodeHandle
in React Native, so it should work.
Hi Again
Finally got it work!
i used findNodeHandle in combination with
TextInputState.focusTextInput(this.node)
Thanks for the tips
@abudel May I see a bigger code example? I'd like to have this work automatically in RRF.
@davidkpiano here you are
import TextInputState from 'TextInputState' ..... //if (isNative) return; const focused = fieldValue.focus; if ((focused && this.node) && ( !this.isToggle() || typeof intent.value === 'undefined' || intent.value === controlProps.value )) { if(isNative) { TextInputState.focusTextInput(this.node) } else { input.focus(); } dispatch(actions.clearIntents(model, intent)); } ....
i did not check if the element to focus in is not a TextInput...
I don't see findNodeHandle
in that code :/
findNodeHandle is taking from your last commit
Any update on this?
The Problem
Can't focus programmatically a Text Input.
Steps to Reproduce
I tried using getRef={(input) => this.refs.input = input } but is always null
I tried to use action to focus the model
<Control.TextInput .... onSubmitEditing={() => dispatch(actions.focus('user.lastName'))} ... />
In this case the state is successfully changed, but the focus remain in the current control. By trying blur and focus<Control.TextInput .... onSubmitEditing={() => { dispatch(actions.blur('user.firstName')); dispatch(actions.focus('user.lastName')); }} ... />
Same here, the state is updated but the focus remain.Expected Behavior
Get reference of the input component by using getRef and call method focus()
Use actions to programmatically set the focus to a specific model
Actual Behavior
Focus not changed.