javascript - 如何在 React 中反转数组

Question

这个问题在这里已经有了答案:





React: Given an array, render the elements in reverse order efficiently

(7 个回答)


3年前关闭。




如何在 react 中反转数组？我尝试使用 this.state.data.maps.reverse 但它不起作用。提前致谢!

import React, { Component } from 'react';

export default class Slideshows extends Component {
    constructor(){
        super();
        this.state = {
            data:[
                { "id": "1", "name": 'Robert', "age": "21" },
                { "id": "2", "name": 'Sam', "age": "33" },
                { "id": "3", "name": 'Jerry', "age": "42" },
            ]
        }
    }
    render() {
        const reverseData = this.state.map((data, i) => {
            return (
                <li> {data.name} | {data.age} </li>
            )
        })
        return (
            <ul>
                {reverseData}
            </ul>
        )
    }
}

Answer 1

您应该首先从您的状态中获取 data，然后在其上应用 reverse()，然后映射反向数组:

    const reverseData = this.state.data.reverse().map((data, i) => {
        return (
            <li> {data.name} | {data.age} </li>
        )
    })