Question

我是React Native的新手，我想在按下按钮时导航到新页面。我创建了自己的自定义按钮，以便在屏幕之间重复使用。

export default class NormalButton extends Component {

constructor(props) {
    super(props);
}

render() {
    return (
        <TouchableOpacity
            style={styles.button}
            onPress={this.props.onPress}
            >
            <Text style={styles.text}>{this.props.text}</Text>
        </TouchableOpacity>
    );
}
}

我想在我的主课程中调用此按钮，然后在单击按钮时导航到另一个屏幕。

export default class Home extends Component {

static route = {
    navigationBar: {
        title: 'Home',
    }
}

constructor(props) {
    super(props);
}

onTestPress = () => {
    this.props.navigator.push('page2');
}

render() {
    return(
        <NormalButton 
            text="test"
            onPress={this.onTestPress}
        />
    );
}
}

当我这样做时，我会收到警告，说“在现有状态转换期间无法更新”此外，如果我从onPress课程中取出Home并将其放在{NormalButton中1}}类，它会在应用程序启动时立即激活onPress并转到下一个屏幕

Answer 1

你需要在这样的道具中使用箭头绑定。

$( "#d1" ).scroll(function() { console.log("Scrolling"); });

Answer 2

Stack navigator是在页面之间导航的最简单方法。请看下面的链接。

https://reactnavigation.org/docs/en/stack-navigator.html

React Native导航按下按钮

2 个答案: