ReactNativeのコンポーネントとしてカスタムアラートを作成しました。私はModalこのカスタムアラートを作成していました。私の問題は、それをどのように使用するかです。Alert.alertReact Nativeで使用する代わりに、自分のアラートを表示したいと思います。
これが私のCustom Alert Modalです。
import React, { Component } from 'react';
import { Text, View } from 'react-native';
import Modal from 'react-native-modal';
import styles from './style';
import Button from '../../components/Button';
export default class CustomAlert extends Component {
renderModalContent = () => (
<View style={styles.content}>
<Text style={styles.contentTitle}>{this.props.title}</Text>
<Text style={styles.contentInfo}>{this.props.content}</Text>
<View style={styles.buttonContainer}>
<Button
color={this.props.buttonColor}
text={this.props.buttonText}
onPress={this.props.buttonOnPress}
/>
</View>
</View>
);
render() {
return (
<View style={styles.container}>
<Modal
isVisible={this.props.isVisible}
backdropColor="#000000"
backdropOpacity={0.9}
animationIn="zoomInDown"
animationOut="zoomOutUp"
animationInTiming={600}
animationOutTiming={600}
backdropTransitionInTiming={600}
backdropTransitionOutTiming={600}
>
{this.renderModalContent()}
</Modal>
</View>
);
}
}
これが私が使いたい方法です。このアラートを関数で表示したい。つまり、関数がエラーに追いついたときに、カスタムアラートを表示したいということです。
myFunction()
.then(() => // do something)
.catch(() => // show my custom alert);
この問題を解決するのを手伝ってくれませんか。
キャッチブロックでisVisibletrueを設定します。
myFunction()
.then(() => // do something)
.catch((e) => this.setState({ isVisible: true }))
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加