ダイレクトマニピュレーション
サブツリー全体を再レンダリングするために state/props を使用せずに、コンポーネントに直接変更を加える必要がある場合があります。例えば、ブラウザで React を使用する場合、DOM ノードを直接変更する必要があることがありますが、これはモバイルアプリのビューでも同じです。setNativeProps は、DOM ノードに直接プロパティを設定することに相当する React Native の機能です。
頻繁な再レンダリングがパフォーマンスのボトルネックになる場合に setNativeProps を使用してください！
直接操作は、頻繁に使うツールではありません。通常、コンポーネント階層のレンダリングや多数のビューの調和によるオーバーヘッドを避けるために、連続的なアニメーションを作成する場合にのみ使用します。setNativeProps は命令的であり、状態を React コンポーネント内ではなくネイティブ層（DOM、UIViewなど）に保存するため、コードの理解を難しくします。
使用する前に、setState と shouldComponentUpdate で問題を解決してみてください。
setNativeProps で TextInput の値を編集する
setNativeProps のもう一つの非常に一般的なユースケースは、TextInput の値を編集することです。TextInput の controlled プロパティは、bufferDelay が低く、ユーザーが非常に速く入力すると、文字をドロップすることがあります。一部の開発者は、このプロパティを完全にスキップし、必要に応じて setNativeProps を使用して TextInput の値を直接操作することを好みます。
例えば、次のコードは、ボタンをタップしたときにインプットを編集する方法を示しています。
- TypeScript
- JavaScript
clear メソッドを使用して TextInput をクリアすることができます。これは同じアプローチで現在の入力テキストをクリアします。
レンダー関数との競合を避ける
レンダー関数によっても管理されているプロパティを更新すると、予測不可能で混乱を招くバグが発生する可能性があります。なぜなら、コンポーネントが再レンダリングされ、そのプロパティが変更されるたびに、以前 setNativeProps から設定された値は完全に無視され、上書きされてしまうからです。