Почему TextInput в компоненте очищается при редактировании TextInput в родительском компоненте?

Question

[Алексей]

К примеру есть компонент

function TestComponent()
{
    const [testValue, setTestValue] = useState('');

    return <TextInput
        value={testValue}
        onChangeText={(text) => setTestValue(text)}
        style={styles.input}
        placeholder="Текст"
        maxLength={50}
    />
}

И при заполнении родительского TextInput, очищается TextInput находящийся в компоненте TestComponent

<TextInput
 value={someValue}
 onChangeText={(text) => setSomeValue(text)}
 style={styles.input}
 placeholder="Текст"
 maxLength={50}
/>
<TestComponent/>

Думаю, что суть даже не в TextInput. По всей видимости, компонент рендерится каждый раз, когда что то происходит извне. Вопрос, как этого можно избежать? Заранее спасибо.

Answer 1

[Роман Александрович]

1 хранить значение дочернего компонента в родителе
2 хранить значение например в redux
3 попробовать использовать shouldComponentUpdate
4 поднять поле импута в родительский компонент
5 можно еще посмотреть в сторону React.memo и React.PureComponent