按钮组件上的 setNativeProps

Question

当我在 React Native 中定义一个 button 为：

<Button ref="buttonRef" title="Button" onPress={this.buttonPressed}/>

其onPress函数为：

buttonPressed(){
  this.refs.buttonRef.setNativeProps({color:"#ffffff"});
}

我收到以下错误：

this.refs.buttonRef.setNativeProps is not a function. (In 'this.refs.buttonRef.setNativeProps({ color: "#ffffff" })', 'this.refs.buttonRef.setNativeProps' is undefined)

但是，如果我要定义任何其他类型的组件，例如text input 作为

<TextInput ref="userInputRef" value={"this is text"} />

随着函数改变其属性：

buttonPressed(){
  this.refs.textRef.setNativeProps({color:"#ffffff"});
}

一切都正确更改。

是否存在 button 组件无法通过 setNativeProps 设置其原生 props 的原因？

Answer 1

Button 组件是由 Touchable 个组件创建的简单自定义组件，它没有 ref 属性。您可以查看 Button 组件 here.

的源代码

如果您需要更改组件的属性，您应该为此使用状态值。

示例

buttonPressed = () => {
  this.setState({color:"#ffffff"});
}

//....

<Button ref="buttonRef" color={this.state.color} title="Button" onPress={this.buttonPressed}/>

按钮组件上的 setNativeProps

setNativeProps on Button Component

react-native

button

react-props