[英]How do I call the openDrawer function on DrawerLayoutAndroid from parent component?
I have made a component which sets up the DrawerLayoutAndroid, which I want to call in my index file. 我已经制作了一个设置DrawerLayoutAndroid的组件,该组件要在索引文件中调用。
drawer.js: 抽屉.js:
export default class MenuDrawer extends Component {
constructor(props) {
super(props);
this.openDrawer = this.openDrawer.bind(this);
}
render() {
var navigationView = (
// ...
);
return (
<DrawerLayoutAndroid
ref={(_drawer) => this.drawer = _drawer}
drawerWidth={200}
drawerPosition={DrawerLayoutAndroid.positions.Left}
renderNavigationView={() => navigationView}>
{this.props.children}
</DrawerLayoutAndroid>
);
}
openDrawer() {
this.drawer.openDrawer();
}
}
I then have everything in the render() function in my index file wrapped around since I want the drawer to be accessible from anywhere. 然后,将索引文件中的render()函数中的所有内容包装起来,因为我希望可以从任何地方访问抽屉。 I just cannot figure out how I open the drawer from the index file.
我只是无法弄清楚如何从索引文件中打开抽屉。 I have tried several different ways to call the function, but I always end up getting undefined is not an object.
我尝试了几种不同的方法来调用该函数,但是我总是最终得到未定义的不是对象。
index.android.js index.android.js
export default class AwesomeProject extends Component {
constructor(props) {
super(props);
this.openMenu = this.openMenu.bind(this);
}
render() {
const { region } = this.props;
return (
<MenuDrawer
ref={(_menudrawer) => this.menudrawer = _menudrawer}
style={styles.layout}>
<TouchableHighlight
style={styles.topbar}
onPress={this.openMenu}>
<Text>Open</Text>
</TouchableHighlight>
</MenuDrawer>
);
}
openMenu() {
this.refs.menudrawer.openDrawer();
}
}
This gives me the error "undefined is not an object (evaluating 'this.refs.menudrawer.openDrawer')". 这给了我错误“未定义不是对象(正在评估'this.refs.menudrawer.openDrawer')”。
How do I go about solving this? 我该如何解决呢?
Thanks 谢谢
It looks good, you're just accessing the menudrawer incorrectly. 看起来不错,您只是错误地访问了菜单抽屉。 It should be:
它应该是:
this.menudrawer.openDrawer();
Because your ref is: 因为您的参考是:
ref={(_menudrawer) => this.menudrawer = _menudrawer}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.