Question

我使用Native Base docs作为创建FooterTab的基础。

如果我将一个Icon元素添加到按钮，则会收到以下错误：undefined不是FooterTab.js中的对象（评估＆＃39; child.props.children.props.name＆＃39;）：114自改变后，现在line 142）。

以下是我在渲染函数中使用的代码：

<Footer>
      <FooterTab>
          <Button active={this.state.detailsTab} onPress={() => this.toggleDetailsTab()}>
              Details
              <Icon name='ios-home' style={globalStyles.inspectionsItemIcon} />
          </Button>
          <Button active={this.state.inspectionTab} onPress={() => this.toggleInspectionTab()}>
              Inspection
          </Button>
          <Button active={this.state.insectsTab} onPress={() => this.toggleInsectsTab()}>
              Insects
          </Button>
          <Button active={this.state.radonTab} onPress={() => this.toggleRadonTab()}>
              Radon
          </Button>
      </FooterTab>
</Footer>

如果我从第一个按钮中移除图标，一切都运行良好。

有什么想法吗？提前谢谢。

Answer 1

请检查您的Icon组件是否从NativeBase导入：

import { Icon } from 'native-base';

FooterTab.js在第88行检查NativeBase的Icon组件。

如果它不是一个，那么它只会在第142行加载'name'属性，这将导致错误，因为有2个子节点（'Details'文本和Icon组件）。

Answer 2

您指的是以前版本的文档

使用最新的Footer Tab

检查docs

另外，您可以查看NativeBase KitchenSink，它展示了NativeBase组件。

检查NativeBase KitchenSink中的Footer Tab

使用Icon时，NativeBase FooterTab返回错误

2 个答案: