访问数组中的字段

时间:2020-06-02 09:24:44

标签: javascript arrays react-native

我对javascript很陌生,似乎无法弄清楚如何遍历以下数组: enter image description here

我的变量称为数据,上面的屏幕截图是我用console.log(data)得到的。
我尝试使用data.spots.map,但得到TypeError: Cannot read property 'map' of undefined。 这是我的代码:

const [listening, setListening] = useState(false);
    const [data, setData] = useState(0);

    let eventSource = undefined;


    useEffect(() => {
        if (!listening) {
            if (Platform.OS === 'ios') {
                eventSource = new RNEventSource("http://10.0.0.24:8080/parking/realtime");
                eventSource.addEventListener('message', (event) => {
                    let obj = JSON.parse(event.data)
                    setData(obj);
                });
            } else {
                eventSource = new EventSource("http://10.0.0.24:8080/parking/realtime");
                eventSource.onmessage = (event) => {
                    let obj = JSON.parse(event.data)
                    setData(obj);
                };
                eventSource.onerror = (err) => {
                    console.error("EventSource failed:", err);
                    eventSource.close();
                }
            }

            setListening(true)
        }
        return () => {
            eventSource.close()
            console.log("event closed")
        }

    }, []);

    return (
        <View style={styles.container}>
            <View style={styles.parkingArea}>
                <Text style={{color: 'white'}}>Details Screen</Text>
                {/*<Text style={{color: 'white'}}>{data.spots}</Text>*/}
                <View style={styles.row}>

                    {
                        //console.log(data.spots)
                        data.spots.map(
                            parkingSpot =>
                                <ParkingSpot text="1"/>
                        )
                    }
                    <ParkingSpot text="1"/>
                    <ParkingSpot text="2"/>
                    <ParkingSpot text="3"/>
                    <ParkingSpot text="4"/>
                    <ParkingSpot text="5"/>
                </View>
            </View>
        </View>

有没有办法做到这一点?请帮忙

0 个答案:

没有答案