Кто знает почему undefined?

Question

[Alex10214]

Привет, выпадает undefined, а почему понять не могу. Может кто-то объяснит?
Вот код:

import React from 'react';
import Header from './Header';
import MapCont from './MapCont';
import './style.scss';

export default function Leftside(props) {
    
    console.log(props) // тут приходит объект : {timestamp: 1580223258, message: "success", iss_position: {…}} <- скопировал с консоли

    const { iss_position } = props;

    console.log(iss_position) // а тут undefined, почему так??

    return (
        <div className="map-container">
            <header>
                <Header position={iss_position} />
            </header>
            <div>
                <MapCont />
            </div>
        </div>
    );
}

Подскажите пожалуйста что не так??

Comments

[Роман Александрович]

const iss_position  = props.iss_position;
console.log("iss_position",iss_position) //что выводит ?

[Mikhail Osher]

Если уж прям всё так, как описываете, то происходит мутация этого объекта props.

[Alex10214]

Роман Александрович, выводит undefined.
console.log(props) // тут приходит объект : {timestamp: 1580223258, message: "success", iss_position: {…}} <- скопировал с консоли и когда развернул объект, то там инфа есть.

[Alex10214]

Mikhail Osher, и как с ней бороться?

[Александр]

Alex10214, можно так:

const propsCopy = JSON.parse(JSON.stringify(props));

[Nikolay Matyushkin]

Это странно. Ищите синтаксические ошибки у себя. Правильно ли именована константа iss_position? Правильно ли вы производите деструктуризацию пропса, т.к. я сэмулировал вашу ситуацию (примерно) и у меня всё ок.

Взял такой объект, и прокинул его в компоненту

let props4 = {
    timestamp: 1580223258,
    message: "success",
    iss_position: {
        name: 'Nicko',
        age: 23,
        city: "Colorado"
    }
};

В компоненте принял этот объект и у меня оба раза console.log отработал нормально

const Header = (props) => {
    console.log(props);   // Здесь отдал весь props

    const { iss_position } = props;

    console.log(iss_position);   // Здесь отдал только объект iss_position 

    return (
        <Container>
            <HeaderWrapper>
                <Left>

                </Left>
                <Center>

                </Center>
                <Right>

                </Right>
            </HeaderWrapper>
        </Container>
    );
};

[Modin]

это похоже на асинхронный код. Вангую, что это запрос куда-то. Он на самом деле тоже сначала в консоли будет promise object (если это промис). А потом туда поставится результат.

[Alex10214]

Seasle, undefined.

[Nikolay Matyushkin]

Modin, не, автор же указывает на то, что якобы в первом консоле у него отображается объект с данными, всё ок. А после деструктуризации, константа iss_position у него, якобы undefined

[Alex10214]

Всем спасибо, Devilz_1, Спасибо большое, за помощь.

[Nikolay Matyushkin]

Alex10214, успехов! Будьте внимательнее!)