当前位置: 首页 > 工具软件 > NativeBase > 使用案例 >

(RN笔记)native-base ActionSheet 报错处理

南门宇
2023-12-01

使用 native-base ActionSheet

经常会 报错

cannot read property _root of null

cannot read property 'showactionsheet' of null

可在页面初始化此组件 通过ref绑定调用组件

<ActionSheet ref={(c) => { this.actionSheet = c; }} />

显示                                   

 this.actionSheet._root.showActionSheet({ options: BUTTONS }, (i) => console.log(i) )

隐藏

this.actionSheet._root.hideActionSheet()

代码如下

import React, { Component } from 'react';
import { View } from 'react-native';
import { ActionSheet, Button, Text } from 'native-base';

class Foo extends Component {
    constructor(props) {
         super(props);
         this.actionSheet = null;
    }

    render() {
         return (
             <View>
                 <Button onPress={() => this.showActionSheet()}>
                     <Text>Action Sheet!</Text>
                 </Button>
                 <ActionSheet ref={(c) => { this.actionSheet = c; }} />
             </View>
         );
    }

    showActionSheet() {
        if ( this.actionSheet !== null ) {
            this.actionSheet._root.showActionSheet({options: [1,2,3]}, (i) => 
            console.log(i));
        }
    }
}

 

 类似资料: