ReactNative开发——系统弹出框

ReactNative开发——系统弹出框

导入Alter组件

import {Alert} from 'react-native'

使用Alert

Alert.alert(    "弹出框标题提示语",    "弹出框正文提示语",    [        {text: 'ask me later'},        {text: '取消', onPress: this.userCanceled},        {text: '确定', onPress: this.userConfirmed}    ],    {cancelable: true});

相信大家可以直接看懂，其中 this.userCanceled 和 this.userCanceled 是我当前组件定义的方法。

userConfirmed() {    this.setState((state) => {        return {needToConfirm: false};    });    //跳转页面    this.props.navigation.navigate('Waiting', {        phoneNumber: this.state.inputedNum, userPw: this.state.inputedPW,    });}userCanceled() {    this.setState((state) => {        return {needToConfirm: false};    });}

注意

如果我们的对调方法，有调用 this.setState 来更新自身的话，可能会有错，因为调用时候的 this，已经不指向我们的组件。所以我们最好在自己组件的构造方法中bind 一下自身的this。

例如：

export default class Register extends Component {    static navigationOptions = {        title: '注册页面'    }    constructor(props) {        super(props);        this.userConfirmed = this.userConfirmed.bind(this);        this.userCanceled = this.userCanceled.bind(this);    }