react:undefined is not a function(this.State({flag:true,}))
来源:互联网 发布:特蕾莎修女知乎 编辑:程序博客网 时间:2024/04/24 19:07
今天在写react的时候遇到这个问题,就查了一下了解了原因和解决方法:
问题代码:
class TestQRAndroidExample extends React.Component{
constructor(props) {
super(props);
this.state = {
torchMode: 'off',
cameraType: 'back',
flag:false,
};
}
barcodeReceived(e) {
console.log('Barcode: ' + e.data);
console.log('Type: ' + e.type);
}
onClick(){
this.setState({
flag:true,
});
console.log("onclick");
QRFromAlbum.chooseImage((res)=>{
var json = JSON.parse(res);
var path = json.imagepath;//得到图片的路径
});
}
render() {
if(this.state.flag){
console.log("flag true");
console.log("path:"+path);
return (<View style={styles.main}>
<BarcodeScanner
viewFinderBackgroundColor="#de6e6a6a"
onBarCodeRead={this.barcodeReceived}
style={styles.containerQRView}
torchMode={this.state.torchMode}
cameraType={this.state.cameraType}>
</BarcodeScanner>
<Text style={styles.text}> 请将取景框对准二维码
</Text>
<TouchableHighlight style={styles.button} underlayColor='#99d9fe' onPress={this.onClick}}>
<Text style={styles.buttontext}>打开相册中的二维码 </Text>
</TouchableHighlight>
<Image style={styles.containerImageView}
source={{uri:path}}>
</Image>
</View>
);
}else{
console.log("flag false");
return (<View style={styles.main}>
<BarcodeScanner
viewFinderBackgroundColor="#de6e6a6a"
onBarCodeRead={this.barcodeReceived}
style={styles.containerQRView}
torchMode={this.state.torchMode}
cameraType={this.state.cameraType}>
</BarcodeScanner>
<Text style={styles.text}> 请将取景框对准二维码
</Text>
<TouchableHighlight style={styles.button} underlayColor='#99d9fe' onPress={this.onClick}}>
<Text style={styles.buttontext}>打开相册中的二维码 </Text>
</TouchableHighlight>
</View>
);
}
}
};
var styles = StyleSheet.create({
containerTextView: {
flex: 1,
},
containerImageView:{
flex: 1,
position:'relative',
width:360,
height:590,
},
containerQRView:{
flex: 1,
width:360,
height:590,
},
text:{
position:'relative',
color:'white',
flex:1,
bottom:160,
left:90,
height:60,
fontSize: 15,
fontWeight: 'bold',
flexDirection:'row',
justifyContent:'center',
},
button:{
position:'relative',
flex:1,
backgroundColor:'#48BBEC',
bottom:170,
left:100,
height:35,
flexDirection:'row',
justifyContent:'center',
borderRadius:10,
},
buttontext:{
flex:1,
fontSize:15,
color:'white',
alignSelf:'center',
},
main:{
flex:1,
position:'absolute',
},
});
AppRegistry.registerComponent('TestUI', () => TestQRAndroidExample);
错误信息:
原因:
this指代的是本函数即onClick并不是TestQRAndroidExample这个类 因此提示错误
解决方法:
第一种:
bind 这个TestQRAndroidExample类
onPress={this.onClick.bind(this)}
第二种:
使用箭头函数
onPress={()=>{this.onClick();}}
- react:undefined is not a function(this.State({flag:true,}))
- undefined is not a function
- React Ajax this.IsMounted() is not a function
- React中报this.isMounted is not a function
- undefined is not a function (evaluating 'this.props.renderScene(route,this)')
- Uncaught TypeError: undefined is not a function
- window.showmodaldialog undefined is not a function
- JS-”Undefined is not a function“错误
- Uncaught TypeError: undefined is not a function
- Uncaught TypeError: undefined is not a function
- ajaxSubmit--->undefined is not a function
- undefined is not a function错误解决
- TYPEERROR: UNDEFINED IS NOT A FUNCTION解决方法
- TypeError:undefined is not a function
- React.render is not a function
- React Native 0.27.2编译报错this._nativeModule.addListener is not a function
- 关于react this.setState is not a function 的报错问题解决
- ExtJs this.addevents is not a function
- cordova--第一次实践
- leetcode:Minimum Depth of Binary Tree 【Java】
- 动态规划初识
- WEB前端开发规范
- 自己常去的php试题网站
- react:undefined is not a function(this.State({flag:true,}))
- Android系统启动过程详解
- 大端与小端
- Getting this error message: dbModel read resource does not implement Zend_Db_Adapter_Abstract
- __thread
- Sping MVC 入门
- Html5 css reset
- Java中的ReentrantLock和synchronized两种锁定机制的对比
- MFC写入文件的尴尬——让ofstream流行起来