0

A api tem a data da seguinte forma:

"period": "2019-10-19T00:00:00.000-03:00",

Puxo a minha flatList da seguinte forma:

componentDidMount() {
        console.log(this.props.navigation)
        this.loadData();
    }
    async loadData() {
        try {
            let response = await axios.get(SERVERNEW + '/activities.json');            
            this.setState({ progr: response.data, loading: false });            
            console.log(response)            
        } catch (error) {
            alert('Não foi possivel carregar os eventos');
            this.setState({ loading: false });
        }
    }

E renderizo da seguinte forma:

render(){
        return this.state.loading ? (
            <View>
                <Spinner visible={true} textContent={'Carregando...'} />
            </View>
        ) : (
            <View style={style.programming.container}>
            <ScrollView>
                <View style={{marginTop: 20, marginLeft: 25}}>
                    <Text style={{fontSize: 20, fontWeight: 'bold', color: '#22abc6'}}>PROGRAMAÇÃO</Text>
                </View>
            <FlatList
                style={{backgroundColor: 'white', marginTop: 10}}
                data={this.state.progr}
                renderItem={({item}) => this.renderItem({item})}
                keyExtractor = {(item, index) => item.id.toString()}
            />
            </ScrollView>

As datas do evento tem dia 16, 17, 18 e 19... Como faço para renderizar exibir primeiro os do dia 16, dps 17 e assim sucessivamente... Creio eu que tenho q usar o filter, mas n tô acertando na sintaxe. Obrigado

2 Respostas 2

1

Segue este exemplo adaptando seu objeto recebido que vai dar certinho:

let listaRecebida = [
	{"period": "2019-10-19T00:00:00.000-03:00"},
	{"period": "2019-10-11T00:00:00.000-03:00"},
	{"period": "2019-10-16T00:00:00.000-03:00"},
	{"period": "2019-10-13T00:00:00.000-03:00"},
	{"period": "2019-10-27T00:00:00.000-03:00"},
	{"period": "2019-10-19T00:00:00.000-03:00"},
];

listaOrdenada = listaRecebida.sort(
	function(a, b){
  	const varA = Date.parse(a.period);
  	const varB = Date.parse(b.period);
  	return varA-varB;
  }
)

console.log('Lista ordenada');
listaOrdenada.forEach(item => {
  console.log(item.period);
});

1
  • Consegui da maneira que coloquei aqui, mas obg 17/09/2019 às 17:23
0

Consegui adaptar da seguinte forma:

<FlatList
                style={{backgroundColor: 'white', marginTop: 10}}
                data={this.state.progr.data.filter(x => x.period === '2019-10-17T00:00:00.000-03:00')}
                renderItem={({item}) => this.renderItem({item})}
                keyExtractor = {(item, index) => item.id.toString()}
            />

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .