Question

以下是我的平面列表renderrow函数，不提供此条件this.state.date.format('YYYYMMDD') <= moment(item.tarih).format('YYYYMMDD') && this.state.secilenAyBasi.year() == moment(item.tarih).format('YYYY') ?，并且renderRow函数对所有项目返回null（因此，如果不返回元素）则返回只想要组件，我尝试了ListEmptyComponent道具但我不想要结果谢谢

  renderRow = (item,index) => {
    return (
    this.state.date.format('YYYYMMDD') <= moment(item.tarih).format('YYYYMMDD') && this.state.secilenAyBasi.year() == moment(item.tarih).format('YYYY') ?
    <View>
     {!this.aynıTarihmi(item,index) ?
    <View style={styles.etkinlikTarihContainer}>
      <Text style={styles.etkinlikTarihText}>
        {moment(item.tarih).format('DD MMMM YYYY')}
      </Text>
    </View> : null}
    <TouchableOpacity style={[styles.etkinlikView,this.aynıTarihmi(item,index) ? {borderTopWidth: 0, borderBottomWidth: 1 }: null]}>
    <View style={{alignItems: 'center', minWidth:70}}>
        {item.mod_txt != "Tüm Gün" ? 
          <View style={{alignItems: 'center', justifyContent:'center'}}> 
            {this.getTime(item.baslangic)}
            {this.getTime(parseInt(item.baslangic, 10) +parseInt(item.sure, 10))}
          </View> :
          item.mod_txt == "Tüm Gün" ?
          <Text style={{color:'black'}}> Tüm Gün </Text> : null}
      </View>
      <View
        style={[styles.etkinlikBordorView,{borderRightColor: item.renk ? item.renk : 'green'}]}
      />
      <View style={{justifyContent: 'flex-start'}}>
        <Text style={{fontSize: 15, marginLeft: 5,color:'black',marginVertical:5}}>
          {item.metin ? item.metin : 'Etkinlik Yok'}
        </Text>
      </View>
    </TouchableOpacity>
    </View> : null
    )}

这是我的平面列表组件：

  getActivity() {

    return (
      <View style={styles.etkinlikContainer}>
      <FlatList
      data={this.state.takvimgirdileriStt}
      extraData={this.state.date}
      renderItem={({item,index}) =>this.renderRow(item, index)}
      keyExtractor = {(item,index) => index.toString()}
      />
      </View>
    )
  }

Answer 1

我认为您的情况不对。

如果日期格式相同，可以尝试以下代码

（moment（this.state.date.format（'YYYYMMDD'））。diff（moment（item.tarih）.format（'YYYYMMDD'）））<0 && moment（this.state.secilenAyBasi.year（））。isSame（moment（item.tarih）.format（'YYYY'））

Answer 2

我认为您不需要空行。您应该先过滤列表this.state.takvimgirdileriStt，然后再将其发送到FlatList。您可以使用类似lodash的_.filter方法的方法。我不确定何时设置数据，但是在获取数据后，您将希望执行类似的操作。

var data = this.state.takvimgirdileriStt;
_.filter(data, function (item) {
    return this.state.date.format('YYYYMMDD') <= moment(item.tarih).format('YYYYMMDD') && this.state.secilenAyBasi.year() == moment(item.tarih).format('YYYY');
}, this);
this.setState({ takvimgirdileriStt: data });

但是，我很确定您也可以返回一个空的<View></View>

因此，与其在打开View之前进行检查，不如在内部尝试：

renderRow = (item, index) => {
    var check = this.state.date.format('YYYYMMDD') <= moment(item.tarih).format('YYYYMMDD') && this.state.secilenAyBasi.year() == moment(item.tarih).format('YYYY');
    return (
        <View>
            {check && (
                // ... all your stuff
            )}
        </View>
}

我也拿出了支票，因为它更容易阅读。

如果返回null，则反应本机Flatlist

2 个答案: