Closed phmngocnghia closed 6 years ago
I got
Possible Unhandled Promise Rejection (id: 0): "timeout"
Here is my code
` import React, { Component } from 'react'; import { StyleSheet, Text, View, ScrollView, TouchableWithoutFeedback, Modal, WebView } from 'react-native'; import ImagePicker from 'react-native-image-picker' import {RichTextEditor, RichTextToolbar} from 'react-native-zss-rich-text-editor' import ShadenTouchableHightLight from './ShadenTouchableHightLight' import RNGooglePlaces from 'react-native-google-places'; import { TextField } from 'react-native-material-textfield' import FAIcon from 'react-native-vector-icons/FontAwesome' import primaryStyles, { PRIMARY_COLOR } from '../style/index' import { Dropdown } from 'react-native-material-dropdown' import request from 'superagent' import { validateObject } from '../helper/validate';
export default class ClinicInfo extends Component {
constructor(props) { super(props);
this.state = Object.assign({}, {data: props.initData}, { clinicType: [], locationError: '', isShowDescriptionModal: false }) // Convert lại thành validate Object... if (typeof this.state.data.name !== 'object') { this.state.data.name = new validateObject('Tên phòng khám', this.state.data.name) }
}
componentDidMount () { this.props.ParentProps.showLoading() request.get('http://deltavn.net/api/clinic-type').set({ 'Authorization': Bearer ${this.props.ParentProps.idToken} }).then((res) => { this.setState({ clinicType: res.body.data }) }).finally(() => { this.props.ParentProps.hideLoading() }) }
Bearer ${this.props.ParentProps.idToken}
async submit () { // Validate tên let newData = Object.assign({}, this.state.data) newData.name.startValidate().required() this.setState({ data: newData })
// Validate địa chỉ if (this.state.data.longitude === 0) { this.setState({ locationError: 'Địa chỉ không được bỏ trống' }) } else if (!this.state.locationError) { this.setState({ locationError: '' }) } if ( this.state.data.name.isValid() && this.state.data.longitude !== 0 && this.state.data.latitude !== 0 ) { this.props.submitCallBack(this.state.data) }
render() { return ( <ScrollView style={{ padding: 20 }}> <TextField error={this.state.data.name.error} value={this.state.data.name.val} onChangeText={(text)=>{ let newData = Object.assign({}, this.state.data) newData.name.val = text this.setState({ data: newData }) }} label='Tên phòng khám' title = 'Không được bỏ trống' />
<Dropdown value={this.state.data.type} valueExtractor={({ id }) => id} labelExtractor={({ name }) => name} title = 'nhấn để chọn' label='Loại phòng khám' data={this.state.clinicType} /> <TouchableWithoutFeedback onPress={()=>{ RNGooglePlaces.openAutocompleteModal({ type: 'address', country: 'VN' }) .then((place) => { if(place.types && place.types.indexOf('street_address') !== -1) { let newData = Object.assign({}, this.state.data) newData.longitude = place.longitude newData.latitude = place.latitude newData.address = place.address this.setState({ data: newData }) this.setState({ locationError: '' }) } else { let newData = Object.assign({}, this.state.data) newData.longitude = 0 newData.latitude = 0 newData.address = '' this.setState({ locationError: 'Địa chỉ phải có đầy đủ quận, huyện, số địa chỉ', }) } }) .finally(() => { this.locationTextInput.blur() }) }}> <View> <TextField marginTop={0} editable={false} value={this.state.data.address} error={this.state.locationError} ref={(r) => this.locationTextInput = r} label='Vị trí phòng khám' title = 'Không được bỏ trống' /> </View> </TouchableWithoutFeedback> <TouchableWithoutFeedback onPress={()=>{ this.setState({ isShowDescriptionModal: true }) }}> <View> <Text style={{ fontSize:18, marginTop: 20, marginBottom: 10 }}>Mô tả phòng khám:</Text> <View style={{ width: '100%', height: 200, borderRadius: 2, borderWidth: StyleSheet.hairlineWidth, borderColor: '#ced4da' }}> <WebView source={{html: this.state.data.description}} /> </View> </View> </TouchableWithoutFeedback> <ShadenTouchableHightLight onPress = {this.submit.bind(this)} marginTop = {30} marginBottom = {30} padding = {15} backgroundColor = {PRIMARY_COLOR} flexDirection = 'row'> <FAIcon name = "edit" size = {15} color = 'white' style = {primaryStyles.Icon} /> <Text style = {primaryStyles.textWhite}>{this.props.submitText}</Text> </ShadenTouchableHightLight> <Modal animationType="slide" transparent={false} visible={this.state.isShowDescriptionModal} onRequestClose={async () => { let description = await this.richtext.getContentHtml() this.setState(state=>{ data: Object.assign({}, state.data, { description }) }) this.setState({ isShowDescriptionModal: false }) }}> <View style={{ flex: 1, width: '100%', padding: 20, paddingTop: 25 }}> <View style={{ flex: 1, borderWidth: StyleSheet.hairlineWidth, borderColor: '#ced4da' }}> <RichTextEditor initialContentHTML={this.state.data.description} ref={(r)=>{ this.richtext = r }} style={styles.richText} initialTitleHTML={'Mô tả phòng khám'} editorInitializedCallback={() => { this.richtext.setTitleFocusHandler(() => { this.richtext.focusContent() }); }} /> </View> <RichTextToolbar onPressAddImage={()=> { ImagePicker.showImagePicker({ includeBase64: true, compressImageQuality: 0.5 }, (image) => { if (image.data) { let imageSrc = `data:${image.mime};base64,${image.data}` this.richtext.insertImage({ src: imageSrc }) } }) }} selectedButtonStyle={{ backgroundColor: 'white' }} getEditor={() => this.richtext} /> <ShadenTouchableHightLight onPress = {async () => { debugger let description = await this.richtext.getContentHtml() this.setState(state=>{ data: Object.assign({}, state.data, { description }) }) this.setState({ isShowDescriptionModal: false }) }} marginTop = {20} marginBottom = {20} padding = {15} backgroundColor = {PRIMARY_COLOR} flexDirection = 'row'> <FAIcon name = "undo" size = {15} color = 'white' style = {primaryStyles.Icon} /> <Text style = {primaryStyles.textWhite}>Quay lại</Text> </ShadenTouchableHightLight> </View> </Modal> </ScrollView> );
} }
const styles = StyleSheet.create({ container: { flex: 1 }, richText: { alignItems:'center', justifyContent: 'center', backgroundColor: 'transparent', height: 400 }, }); `
I got
Possible Unhandled Promise Rejection (id: 0): "timeout"
Here is my code
` import React, { Component } from 'react'; import { StyleSheet, Text, View, ScrollView, TouchableWithoutFeedback, Modal, WebView } from 'react-native'; import ImagePicker from 'react-native-image-picker' import {RichTextEditor, RichTextToolbar} from 'react-native-zss-rich-text-editor' import ShadenTouchableHightLight from './ShadenTouchableHightLight' import RNGooglePlaces from 'react-native-google-places'; import { TextField } from 'react-native-material-textfield' import FAIcon from 'react-native-vector-icons/FontAwesome' import primaryStyles, { PRIMARY_COLOR } from '../style/index' import { Dropdown } from 'react-native-material-dropdown' import request from 'superagent' import { validateObject } from '../helper/validate';
export default class ClinicInfo extends Component {
constructor(props) { super(props);
}
componentDidMount () { this.props.ParentProps.showLoading() request.get('http://deltavn.net/api/clinic-type').set({ 'Authorization':
Bearer ${this.props.ParentProps.idToken}
}).then((res) => { this.setState({ clinicType: res.body.data }) }).finally(() => { this.props.ParentProps.hideLoading() }) }async submit () { // Validate tên let newData = Object.assign({}, this.state.data) newData.name.startValidate().required() this.setState({ data: newData })
}
render() { return ( <ScrollView style={{ padding: 20 }}> <TextField error={this.state.data.name.error} value={this.state.data.name.val} onChangeText={(text)=>{ let newData = Object.assign({}, this.state.data) newData.name.val = text this.setState({ data: newData }) }} label='Tên phòng khám' title = 'Không được bỏ trống' />
} }
const styles = StyleSheet.create({ container: { flex: 1 }, richText: { alignItems:'center', justifyContent: 'center', backgroundColor: 'transparent', height: 400 }, }); `