直接操作

有時需要直接對組件進行變更，而無需使用 state/props 來觸發整個子樹的重新渲染。例如，在瀏覽器中使用 React 時，有時需要直接修改 DOM 節點，行動應用程式中的視圖也是如此。 setNativeProps 相當於 React Native 中直接設定 DOM 節點的屬性。

注意

當頻繁重新渲染造成效能瓶頸時，請使用 setNativeProps！

直接操作不會是您經常使用的工具。您通常只會在建立連續動畫時使用它，以避免渲染組件層次結構和協調多個視圖的開銷。 setNativeProps 是命令式的，並且將狀態儲存在原生層（DOM、UIView 等）中，而不是在您的 React 組件中，這會使您的程式碼更難以理解。

在使用它之前，請嘗試使用 setState 和 shouldComponentUpdate 來解決您的問題。

使用 setNativeProps 編輯 TextInput 值

setNativeProps 的另一個非常常見的用例是編輯 TextInput 的值。當 bufferDelay 較低且使用者輸入速度非常快時，TextInput 的 controlled 屬性有時會遺漏字元。有些開發人員更喜歡完全跳過此屬性，而是使用 setNativeProps 在必要時直接操作 TextInput 值。

例如，以下程式碼示範了在點擊按鈕時編輯輸入

TypeScript

JavaScript

您可以使用 clear 方法來清除 TextInput，這會使用相同的方法清除目前的輸入文字。

避免與 render 函數衝突

如果您更新的屬性也由 render 函數管理，您最終可能會遇到一些不可預測且令人困惑的錯誤，因為每當組件重新渲染且該屬性變更時，先前從 setNativeProps 設定的任何值都將被完全忽略和覆蓋。