ReactNative (Expo)로 Confirm 대화 상자를 발행
7015 단어 reactnative
구현
우선 최근 필요한 Confirm 다이얼로그를 꺼내 본다.
아무래도 View 안에
App.js
import React from 'react';
import { StyleSheet, Text, View, Button } from 'react-native';
import { ConfirmDialog } from 'react-native-simple-dialogs';
export default class App extends React.Component {
state = {
dialogVisible: false,
}
render() {
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
<Text>App</Text>
<Button
title="実行"
onPress={() => this.setState({ dialogVisible: true })}
/>
<ConfirmDialog
title="確認画面"
message="本当に実行しますか?"
visible={this.state.dialogVisible}
onTouchOutside={() => this.setState({ dialogVisible: false })}
positiveButton={{
title: 'はい',
onPress: () => {
// alert('OK')
this.setState({ dialogVisible: false });
console.log('OK');
// alert('OK');
}
}}
negativeButton={{
title: 'いいえ',
onPress: () => this.setState({ dialogVisible: false })
}}
// overlayStyle={{ backgroundColor:"#eee"}}
/>
</View>
);
}
}
문제 결과
여러가지 사용할 수 있을 것 같다.
Reference
이 문제에 관하여(ReactNative (Expo)로 Confirm 대화 상자를 발행), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/zaburo/items/a60cc995f3cad7c0c25a텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)