如何将空地图正确设置为已解析的 json（这是一张新地图）？

Question

我已经声明了这个空映射 mapA = {} 但由于某些原因，当我将它设置为已解析的 json mapA = parsedJSON 时会导致相同或重复键的错误。

我获取的 json 是这样的 [{a:1},{a:2},{a:3}]，只是为了澄清...这是一个 json 对吗？因为它也是一种数组，对吗？

但我将其作为 json 字符串获取，然后对其进行解析，然后我收到了我提到的错误。

然而，mapA = [{a:1},{a:2},{a:3}] 对我有用，但这是硬编码的。到底哪里出了问题？

EDIT1:

这是我使用的示例数据

[{"location_id":1,"flight_location":"KUL","description":"Kuala Lumpur","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":2,"flight_location":"KIX","description":"Osaka-Kansai","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":3,"flight_location":"PEK","description":"Beijing","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":4,"flight_location":"HGH","description":"Hangzhou","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":5,"flight_location":"PVG","description":"Shanghai","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":6,"flight_location":"SZX","description":"Shenzhen","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":7,"flight_location":"DPS","description":"Bali","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":8,"flight_location":"CGK","description":"Jakarta","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":9,"flight_location":"DMK","description":"Bangkok","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0}]

这是我的代码：

let fakeData = [{"location_id":1,"flight_location":"KUL","description":"Kuala Lumpur","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":2,"flight_location":"KIX","description":"Osaka-Kansai","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":3,"flight_location":"PEK","description":"Beijing","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":4,"flight_location":"HGH","description":"Hangzhou","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":5,"flight_location":"PVG","description":"Shanghai","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":6,"flight_location":"SZX","description":"Shenzhen","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":7,"flight_location":"DPS","description":"Bali","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":8,"flight_location":"CGK","description":"Jakarta","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0},{"location_id":9,"flight_location":"DMK","description":"Bangkok","update_by":null,"update_time":null,"create_by":null,"create_time":null,"rec_state":0}];

let flights = {};


fetch(link) //link is the api link which I use to fetch the data
    .then(function(response) {
      return response.json(); //In here I parse it
    }).then(function(json) {
        /*flights = fakeData;     Causes same error. Run this only to test when api is down */  
        flights = json; // Same error. Set our flights map to the parsed json which is the map     
    }).catch(function(ex) {
      console.log('parsing failed', ex);
    });

控制台输出：

这是来自 React 库。顺便说一句，我不太熟悉他们库中的代码。

我的组件：

航班列表

const FlightList = ({flights, deleteFlight}) => {
    return (
        <table className="table">
            <thead>
                <tr>
                    <th>ID</th>
                    <th>Location</th>
                    <th>Description</th>
                </tr>
            </thead>
            <tbody>
                {flights.map(flight =>
                    <FlightListRow key={flight.location_id} flight={flight}/>
                )}
            </tbody>
        </table>
    );
};

航班列表行

const FlightListRow = ({flight}) => {
    return (
        <tr>
            <td><Link to={'/editflight/' + flight.location_id}>{flight.location_id}</Link></td>
            <td><Link to={'/editflight/' + flight.location_id}>{flight.flight_location}</Link></td>
            <td><Link to={'/editflight/' + flight.location_id}>{flight.description}</Link></td>
        </tr>
    );
};

Answer 1

这是一个反应错误，这意味着在你的反应组件中，你有一个组件数组，并且你在两个或多个组件上使用相同的键

       {flights.map((flight,index) =>
            <FlightListRow key={index} flight={flight}/>
        )}

如何将空地图正确设置为已解析的 json（这是一张新地图）？

How to properly set an empty map to a parsed json (which is a new map)?

javascript

arrays

fetch

reactjs