如何在本机反应中调用子内部的父函数
如何在本机反应中调用子内部的父函数
提问于 2017-10-16 19:39:05
在搜索了几个小时后没有找到答案..。我在寻求你的帮助。
因此，我想要做的是:在子进程中调用名为_toggleSearchBar()的函数(在父函数中)，因此当onPress事件(在子事件中)触发时，它会更改父事件中的'isVisible‘值。
亲本
class HomeScreen extends React.Component {
constructor(props) {
super(props);
this.state = {isVisible: false};
}
static navigationOptions = {
title: 'P O S T E R',
headerStyle: { backgroundColor: '#CECECE' },
headerTitleStyle: { color: 'black', fontSize: 30, fontFamily: 'HelveticaNeue-CondensedBlack'},
headerRight: <DisplayIcon src={require('./ressources/icon_search.png')} myMethod={'HERE'}/>,
headerLeft: <DisplayIcon src={require('./ressources/icon_aroundMe.png')}/>,
};
render() {
const { navigate } = this.props.navigation;
return (
<View>
<View style={styles.bck}>
<ScrollView>
<DisplayImage src={require('./ressources/logo.jpg')} />
<DisplayImage src={require('./ressources/logo1.jpeg')} />
<DisplayImage src={require('./ressources/logo2.jpg')} />
<DisplayImage src={require('./ressources/logo3.jpeg')} />
<DisplayImage src={require('./ressources/logo4.jpg')} />
<DisplayImage src={require('./ressources/logo5.jpeg')} />
<DisplayImage src={require('./ressources/bde.jpeg')} />
</ScrollView>
</View>
<Display enable={this.state.isVisible} style={styles.ViewIn}>
<View>
<TextInput style={styles.textIn}></TextInput>
</View>
</Display>
</View>
)
}
_toggleSearchBar() {
this.setState(previousState => {
return { isVisible: !this.state.isVisible };
});
}
}儿童
class DisplayIcon extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<TouchableHighlight onPress={this.myMethod} activeOpacity= {0.4} underlayColor={ 'rgb(206, 206, 206)' }>
<Image style={styles.Picture} source={this.props.src}/>
</TouchableHighlight>
);
}
}
const styles = StyleSheet.create({
Picture: {
marginLeft: 10,
marginRight: 10,
height: 30,
width: 30,
}
});宾德没起作用。也不能通过道具传递功能..。
感谢您的帮助和时间！
回答 2
Stack Overflow用户
发布于 2017-10-16 19:44:23
在子组件中，您应该调用this.props.myMethod而不是this.myMethod。
示例：
<TouchableHighlight onPress={this.props.myMethod} activeOpacity= {0.4} underlayColor={ 'rgb(206, 206, 206)' }>在您的父中，您应该将一个道具传递给子- myMethod={this._toggleSearchBar}。
示例：
<DisplayIcon src={require('./ressources/icon_search.png')} myMethod={this._toggleSearchBar}/>请注意，您应该将_toggleSearchBar绑定到class。
在constructor中这样做：
constructor(props){
super(props);
this._toggleSearchBar = this._toggleSearchBar.bind(this);
}Stack Overflow用户
发布于 2017-10-16 20:23:01
帮助理解
在孩子的体内。
这不起作用(通过父函数)
<TouchableHighlight onPress={this.props.myMethod} activeOpacity= {0.4} underlayColor={ 'rgb(206, 206, 206)' } style={styles.lol}>
<Image style={styles.Picture} source={this.props.src}/>
</TouchableHighlight>
这是工作的(通过子函数)
lol() {
alert('lol');
}
render() {
return (
<TouchableHighlight onPress={this.lol} activeOpacity= {0.4} underlayColor={ 'rgb(206, 206, 206)' } style={styles.lol}>
<Image style={styles.Picture} source={this.props.src}/>
</TouchableHighlight>
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/46777874
复制相关文章
相似问题
腾讯云开发者
