Question

我是新来的人，正在尝试react-native-video。我试图通过单击可触摸元素来更改react-native-video库中的道具。但是我收到了错误消息：

未定义不是对象（正在评估'this.state.setState'）

我确定这是一个简单的问题。我基本上只想了解当我触摸定义的Touchable区域时如何启动，调用和更改道具的状态。在此示例中，我想将速率从0.1更改为1。

这是我的代码：

type Props = {};
export default class App extends Component<Props> {
  state = {
    rate: 0.1,
  };

  _onPressButton() {
    Alert.alert('You tapped the button!')
    this.state.setState({ rate: 1 });
  }

  render() {

    return (
      <View style={styles.container}>

        <Video
          source={require('./assets/grid.mp4')}
          ref={(ref) => {
            this.player = ref
          }}                                      
          onBuffer={this.onBuffer}                
          onError={this.videoError}               
          style={styles.backgroundVideo}
          rate={this.state.rate}
        />

        <TouchableWithoutFeedback onPress={this._onPressButton}>
          <View style={styles.square1}>
            <Text style={styles.welcome}>My text</Text>
          </View>
        </TouchableWithoutFeedback>
      </View>
    );
  }
}

Answer 1

错误提到：

未定义不是对象（正在评估'this.state.setState'）

this.state没有名为setState的对象

更改：

_onPressButton() {
    Alert.alert('You tapped the button!')
    this.state.setState({ rate: 1 });
  }

收件人：

_onPressButton() {
    Alert.alert('You tapped the button!')
    this.setState({ rate: 1 });
  }

此外，您需要更改：

<TouchableWithoutFeedback onPress={this._onPressButton}>

到

<TouchableWithoutFeedback onPress={() => this._onPressButton()}>

Answer 2

您没有绑定功能。

_onPressButton() {
    Alert.alert('You tapped the button!')
    this.state.setState({ rate: 1 });
  }

应该是这样的箭头功能

_onPressButton = () => {
    Alert.alert('You tapped the button!')
    this.state.setState({ rate: 1 });
  }

或者您需要创建一个构造函数并在其中编写this._onPressButton.bind(this)。

Answer 3

您的onPressButton方法不受上下文限制，并且如上述答案所述，您需要使用this.setState({ rate: 1 });。

您可以添加一个构造函数并使用.bind(this)，如下所示：

constructor(props) {
    super(props);

    this. _onPressButton = this. _onPressButton.bind(this)
  }

或者您可以使用如下所示的自动绑定箭头功能：

_onPressButton = () => {
    Alert.alert('You tapped the button!')
    this.setState({ rate: 1 });
  }

更改视频反应原生视频组件的状态/属性

3 个答案: