React Native:出于性能原因,此合成事件被重用。试图通过状态

时间:2018-09-04 13:46:35

标签: reactjs react-native react-navigation

我有两个屏幕,想要将状态从一个屏幕传递到另一个屏幕。

简化屏幕1:

import React, { Component } from 'react';
import { View, TextInput} from 'react-native';
import { buttons } from '../../components/buttons/Buttons';

export default class LoginScreen extends Component {
  constructor(props) {
    super(props);

    this.state = {
      username: '',
    }
  }

  render() {
    return(
      <View>
       ...
        <TextInput onChange={(input) => this.setState({username: input})}></TextInput>
        ...
        <Button.main onPress={() => this.props.navigation.navigate('Register', {username: this.state.username})} title='Create Account'/>
      </View>
    )
  }
}

现在,如果我按下按钮,我想将this.state.username传递到新屏幕。如果我不使用onChange={(input) => this.setState({username: input})}并手动为用户名设置一个值,如下所示:

this.state = {
    username: 'Test',
}

该值可以毫无问题地传递,我可以从新屏幕访问它。但是,当我尝试更改this.state.username的同时更改TextInput并通过this.state.username时,会收到以下警告:

警告:出于性能原因,此合成事件被重用。如果看到此消息,说明您正在访问已发布/无效的合成事件中的属性isTrusted。设置为空。如果必须保留原始的合成事件,请使用event.persist()。

我不知道如何使用警告中建议的event.persist(),并且用户名也无法通过。

很抱歉,如果这是一个愚蠢的问题,但我找不到解决方案,而且我是初学者。如果有人可以帮助我,我会很高兴:)

1 个答案:

答案 0 :(得分:2)

尝试使用onChangeText代替onChange。