【发布时间】:2016-11-25 13:54:03
【问题描述】:
我在 react-native 中有一个项目,在我的项目中我有列表视图和模态,列表视图需要构造函数,而模态需要构造函数,当我尝试使用两个构造函数时出现错误,我该如何解决这种情况?请帮忙 !!
import React, { Component } from 'react';
import {
StyleSheet,
ToolbarAndroid
,AppRegistry,
View,
Text,
TouchableHighlight,
Modal,
TextInput,
ListView,ActionButton,
Image,
Alert
} from 'react-native';
var DialogAndroid = require('react-native-dialogs');
export default class HygexListView extends Component {
constructor() {
super(...arguments);
this.state = {
visible: false
};
}
constructor(props){
super(props);
var ds = new ListView.DataSource({
rowHasChanged: (r1, r2) => r1 != r2
});
this.state = {
ds:[{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"},{CustomerName: "Customer Name", CustomerPhone: "+564659878964"}],
dataSource:ds,
}
}
componentDidMount(){
this.setState({
dataSource:this.state.dataSource.cloneWithRows(this.state.ds),
})
}
pressRow(rowData){
var newDs = [];
newDs = this.state.ds;
newDs[0].Selection = newDs[0] == "CustomerName" ? "CustomerPhone" : "";
this.setState({
dataSource: this.state.dataSource.cloneWithRows(newDs)
})
showModal = () => {
this.setState({
visible: true
});
};
hideModal = () => {
this.setState({
visible: false
});
};
}
renderRow(rowData){
return (
<TouchableHighlight
onPress={()=> this.showModal()}
underlayColor = '#ddd'>
<View style ={styles.row}>
<Text style={{fontSize:19}}>{rowData.CustomerName} {"\n"} {rowData.CustomerPhone} </Text>
<View style={{flex:1}}>
<Text style={styles.selectionText}>{rowData[rowData.Selection]}</Text>
</View>
</View>
</TouchableHighlight>
)
}
render() {
return (
<View style={styles.container}>
<View style={styles.toolbar}>
<TouchableHighlight >
<Image style={styles.imagestyle}
source={require('./ic_search.png')}/>
</TouchableHighlight>
<Text style={styles.toolbarTitle}>CUSTOMERS</Text>
<TouchableHighlight onPress={() => this.moveToAddNewCustomer()}>
<Image style={styles.imagestyle}
source={require('./ic_action_name.png')} />
</TouchableHighlight>
</View>
<ListView
dataSource = {this.state.dataSource}
renderRow = {this.renderRow.bind(this)}>
</ListView>
<View style={styles.x}>
<TouchableHighlight style={styles.action1}>
<Text style={styles.actionText}>CUSTOMERS</Text>
</TouchableHighlight>
<TouchableHighlight style={styles.action1}
onPress={() => this.moveToOrderEntry()}>
<Text style={styles.actionText}>Order Entry</Text>
</TouchableHighlight>
<TouchableHighlight style={styles.action}
onPress={() => this.moveToMyOredre()}>
<Text style={styles.actionTex1}>My Order</Text>
</TouchableHighlight>
</View>
<Modal
visible={this.state.visible}
>
<View style={styles.modalContainer}>
<View style={styles.toolbar}>
<View>
<Text style={styles.toolbarTitle}>X</Text>
</View>
<Text style={styles.toolbarTitle}>Details</Text>
</View>
<View style={styles.ButtonflexDirection}>
<Text >CUSTOMER Name</Text>
</View>
<View style={styles.ButtonflexDirection}>
<Text >Address</Text>
</View>
<View style={styles.ButtonflexDirection}>
<Text >Phone Number</Text>
</View>
<View style={styles.ButtonflexDirection}>
<Text >Interested Product</Text>
</View>
<View style={styles.ButtonflexDirection}>
<Text >Discount</Text>
</View>
<View >
<TouchableHighlight style={styles.button}
onPress={() => this.moveToHygexListView()}>
<Text style={styles.buttonText}> ADD ORDER</Text>
</TouchableHighlight>
</View>
</View>
</Modal>
</View>
)
}
moveToMyOredre() {
this.props.navigator.push({
id: 'MyOrder'
})
}
moveToOrderEntry() {
this.props.navigator.push({
id: 'OrderEntry'
})
}
moveToAddNewCustomer() {
this.props.navigator.push({
id: 'AddNewCustomer'
})
}
}
【问题讨论】:
-
在 ES6 中没有这种类型的多态性,并且您的实例将始终在参数中收到
props值,即使您没有在函数声明中编写任何参数,因此,您不能有两个构造函数。你说视图和模态需要一个构造函数。这到底是什么意思? -
这是我的代码检查它,当我运行代码时出现错误,“重复使用构造函数”!如何解决?
-
你不能有两个构造函数。将两者的逻辑合二为一,它应该可以工作。
-
如何制作?你能合并吗?我的代码在这里!!!
标签: javascript android ios react-native