react-native - TypeError: TypeError: undefined is not an object (评估 'this.onPressDropdownData(this.data).bind')
问题描述
我想要的是将涉及复选框选择、下拉选择和其他所有内容的输入记录到警报框中。我无法将下拉选择和复选框选择捕获到一种状态,并将所有这些输入的详细信息进一步放入警报框中。
下面是代码:
import * as React from 'react';
import {
Text, View, StyleSheet, TouchableOpacity, ScrollView, Button
}
from 'react-native';
import {
Header, Icon
}
from 'react-native-elements';
import {
Constants
}
from 'expo';
import {
CheckBox
}
from 'react-native-elements';
import {
createStackNavigator,
createNavigatorContainer
}
from "react-navigation";
import {
Dropdown
}
from 'react-native-material-dropdown';
export
default class UpdateFrequency extends React.Component {
static navigationOptions = {
title: 'UPDATE FREQUENCY',
style: {
display: 'flex',
flexDirection: 'row',
backgroundColor: "#FFD700"
}
};
constructor(props) {
super(props);
// this.toggle= this.toggle.bind(this);
this.state = {
ischecked: true,
data: '',
time: 0
}
}
onChangeCheck() {
this.setState({
ischecked: !this.state.ischecked
});
}
onPressDropdownData(data) {
this.setState({
data: data
});
}
onPressDropdownTime(time) {
this.setState({
time: time
});
}
render()
{
const data = [{
value: '3 Hours'
}, {
value: '6 Hours'
}, {
value: '12 Hours'
}, {
value: 'Daily'
}];
const time = [{
value: '6 AM'
}, {
value: '00:00 HRS'
}];
return ( < View style = {
styles.container
} >
< Text style = {
styles.writeup
} > Use this page to select how many updates you would like to receive at once. < /Text>
<View style={StyleSheet.create({flex:1})}>
<CheckBox style={styles.one}
center
title="Receive Simultaneously"
checkedIcon="dot-circle-o"
uncheckedIcon="circle-o"
checked={this.state.ischecked}
value={this.state.ischecked}
onPress={this.onChangeCheck.bind(this)}
/ >
< Dropdown label = '# Updates to Receive'
data = {
data
}
onPress = {
this.onPressDropdownData(this.data).bind(this)
}
/>
<Dropdown
label='Delay Between Updates'
data={time}
onPress={this.onPressDropdownData(this.data).bind(this)}
/ >
< TouchableOpacity style = {
styles.adsense
}
onPress = {
() = > {
alert('Receive simultaneously : ' + this.state.ischecked + '\n' + 'No. of updates to receive : ' + this.state.data + '\n' + 'Delay between updates : ' + this.state.time);
}
} > < Text > Show recorded inputs < /Text>
</TouchableOpacity >
< /View>
<TouchableOpacity style={styles.adsense}>
<Text>Adsense Ad</Text > < /TouchableOpacity>
</View >
);
}
}
const styles = StyleSheet.create({
container: {
flex: 1,
display: 'flex',
flexDirection: 'column'
},
writeup: {
flex: 0.3,
backgroundColor: '#FFE4B5',
justifyContent: 'center',
alignItems: 'center',
padding: 8
},
adsense: {
flex: 0.55,
justifyContent: 'center',
alignItems: 'center',
backgroundColor: '#778899',
},
});
解决方案
错误是你不能这样做:this.onPressDropdownData(this.data).bind(this)
.
首先,我向您推荐使用箭头函数来创建类方法。箭头函数可避免您进行显式绑定。
为了解决您的问题:
如果你想在绑定时传递额外的参数,看这个:传递额外的参数来绑定?.
如果要访问在
data
中创建的变量render
,则只能使用变量的名称访问,保留字this
用于属于该类的方法或属性。我的意思是,只有data
,不是this.data
。
有关箭头功能的阅读链接:
推荐阅读
- docker - docker:我可以在 ARM 原生系统中使用 linux i386 映像吗?
- sql - Hive:如何将数据从分区表插入分区表?
- android - 更改可见性时 LiveData 不更新?
- java - 解析xml和json文件之间的混淆
- weblogic - 在 weblogic 12.2.1.3.0 中,我可以在哪里配置部署的应用程序版本限制?
- php - PHP 从 43556 等值中获取月份和年份
- c - 是否允许返回具有灵活数组成员的结构?
- objective-c - 在 Swift 中访问 ObjectiveC UIAlertController 类别
- javascript - 如何对角材料表中的表格行应用一些样式
- html - 我想在单击不同按钮时执行不同操作,我编写的代码不起作用?