NativeBase FooterTab在使用图标时返回错误

NativeBase FooterTab returns error when using an Icon

本文关键字：返回 错误 图标 FooterTab NativeBase      更新时间：2023-09-26

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

我收到以下错误，如果我添加一个图标元素的按钮:undefined不是一个对象(评估' children.props. children.props.name')从FooterTab.js:114(已更改，现在第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>

如果我从第一个按钮上删除图标，一切都可以正常工作。

任何想法?

请检查图标组件是否从NativeBase导入:

import { Icon } from 'native-base';

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

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

你指的是以前版本的文档

用最新的文档检查页脚标签

你也可以检查NativeBase kitensink，它展示了NativeBase组件。

查看NativeBase kitensink页脚标签

相关文章：