在 FlatList React Native Android 上下拉时静音崩溃

Silent crash when pulling down on FlatList React Native Android

提问人:Robert Smith 提问时间:8/1/2023 最后编辑:Robert Smith 更新时间:8/4/2023 访问量:123

问:

我正在使用 react-native 0.59.9 开发一个传统的 react native 应用程序。我正在使用 FlatList 来显示播客列表。如果我在列表中下拉(就像我试图刷新一样),应用程序会崩溃,并且我没有收到任何日志。我没有实现任何代码来执行拉取刷新。FlatList 不在 ScrollView 中。我可以向下滚动,但如果我回到列表顶部,它就会崩溃。我不知所措。下面是代码。(错别字来自以前的开发人员,我还没有来得及修复它们)关于我如何追踪这一点或原因可能是什么的任何想法?我已将 android studio 附加到模拟器以查看 logcat 显示的内容,但我没有看到任何提示我的东西。它在 iOS 上运行良好。

return (
      <View>
        {this.renderPtsModal()}
        <Col style={{ flexDirection: 'row', maxHeight: 40 }}>
          <Row style={{ height: 40,marginLeft:10 }}>
            {this.renderFilter()}

          </Row>
          <Row style={{ height: 40,}}>
            {this.renderSearchModal()}
          </Row>
        </Col>
        {this.renderModalFilter()}
        <Col>
          <Row>
            <Popover
              contentStyle={{ alignItems: 'center', width: 170, padding: 8, backgroundColor: 'rgba(180, 209, 35, 1)', borderRadius: 8, }}
              arrowStyle={{ borderTopColor: 'rgba(180, 209, 35, 1)', }}
              backgroundStyle={{ backgroundColor: 'rgba(0, 0, 0, 0)' }}
              visible={this.state.showPopover}
              fromRect={this.state.popoverAnchor}
              // onClose={this.closePopover}
              placement="bottom">
              <Row style={{ flexDirection: 'column' }}>
                <Col style={{ alignItems: 'flex-end', }}>
                  <TouchableOpacity onPress={this.closePopover}>
                    <View style={{ backgroundColor: 'rgba(180, 209, 35, 0.8)', width: 40, height: 20, }}>
                      <Image source={require('../../images/close.png')} resizeMode={'stretch'} style={{ width: 13, height: 13, alignSelf: 'flex-end' }} />
                    </View>
                  </TouchableOpacity>
                </Col>
                <Col>
                  <Text style={{ color: '#0B254B', fontSize: 13, }}>Did You Know...</Text>
                </Col>
                <Col style={{ paddingTop: 10 }}>
                  <Text style={{ color: '#0B254B', fontSize: 12, lineHeight: 18 }}>
                    You can listen to podcasts, watch videos and answer questions to earn points!
                         </Text>
                </Col>
                <Col style={{ flexDirection: 'row', paddingTop: 10 }}>
                  <TouchableOpacity onPress={this.CheckBoxPress}>
                    <View style={{ backgroundColor: 'rgba(180, 209, 35, 0.8)', borderRadius: 0.5, width: 16, height: 16, borderColor: 'white', borderWidth: 1 }}>
                      <Image source={require('../../images/checkSelectBox.png')} resizeMode={'stretch'} style={{ width: 13, height: 13, display: this.state.isCheck }} />
                    </View>
                  </TouchableOpacity>
                  <Text style={{ color: '#0B254B', fontSize: 12, marginLeft: 5, }}>
                    Don't Show Again
                </Text>
                </Col>
              </Row>
            </Popover>
            <FlatList
              data={this.state.postcast_data}
              extraData={this.state}
              keyExtractor={item => item.guid["#text"]}
              renderItem={({ item, index }) => this.renderRow(item, index)}/>
          </Row>
        </Col>
      </View>
Android ReactJS 列表 滚动 原生

评论


答:

0赞 Robert Smith 8/4/2023 #1

一段时间后,我终于将问题缩小到渲染行内的 Web 视图。为此,Web 视图是不必要的,因此将其替换为 Text 解决了崩溃问题。