touchableopacity onpress函数undefined(不是函数)React Native [英] touchableopacity onpress function undefined (is not a function) React Native
本文介绍了touchableopacity onpress函数undefined(不是函数)React Native的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我希望能够在点按TouchableOpacity按钮后导航到新屏幕但我收到错误消息
I want to be able to navigate to a new screen after tapping the TouchableOpacity button but I receive an error which says
_this3。 handleThisTap不是一个函数。 (在'_this3.handleThisTap()'中,'_ this3.handleThisTap'未定义)
_this3.handleThisTap is not a function. (In '_this3.handleThisTap()','_this3.handleThisTap' is undefined)
import React, { Component } from 'react';
import {
Text,
StyleSheet,
View,
TextInput,
KeyboardAvoidingView,
FlatList,
TouchableOpacity,
TouchableHighlight,
} from 'react-native';
import {
SearchBar,
Wrapper,
ItemWrapper,
} from './searchView.styles';
export default class SearchView extends Component {
constructor(props) {
super(props);
this.state = {
feedUrl: 'https://api.urbandictionary.com/v0/autocomplete?term=',
isLoading: true,
}
}
handleTextChange(text) {
let url = this.state.feedUrl + text;
return fetch(url)
.then((response) => response.json())
.then((res) => {
this.setState({
data: res,
isLoading: false,
})
})
.catch((error) => {
console.log(error);
})
}
handleThisTap(item) {
this.props.navigation.navigate('FeedView', item);
}
_renderItem({ item }) {
return (
<ItemWrapper
underlayColor='white'
onPress={() => this.handleThisTap(item)}>
<Text>{item}</Text>
</ItemWrapper>
)
}
render() {
return (
<Wrapper behavior="padding">
<SearchBar
style={{
shadowOffset: {
width: 0,
height: 5,
},
}}
autoFocus={true}
clearTextOnFocus={true}
placeholder="Search for text here"
returnKeyType='search'
clearButtonMode='always'
keyboardShouldPersistTaps={true}
onChangeText={(text) =>
this.handleTextChange(text)
} />
<FlatList
data={this.state.data}
renderItem={this._renderItem}
/>
</Wrapper>
)
}
}
我试过用 bind。(this)
感谢任何帮助。
推荐答案
错误源于你没有将 _renderItem
绑定到这个
。将它绑定在构造函数
中:
The error arises from that you didn't bind _renderItem
to this
. Bind it in constructor
:
constructor(props) {
super(props);
this.state = {
feedUrl: 'https://api.urbandictionary.com/v0/autocomplete?term=',
isLoading: true,
}
this._renderItem = this._renderItem.bind(this); //add this line
}
这篇关于touchableopacity onpress函数undefined(不是函数)React Native的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文