Блог

Почему работает следующий код:

 import React, { useState } from "react";
 

Но когда я меняю порядок, это НЕ работает:

 import { useState }, React from "react";
 

И я получаю следующую ошибку. По-видимому, это точно такие же команды, только в обратном порядке.

Для справки, вот весь файл:

 import React, { useState } from "react";
// import { useState }, React from "react";

import MoviesList from "./components/MoviesList";
import "./App.css";

function App() {
    const [movies, setMovies] = useState([]);
    function fetchMoviesHandler() {
        fetch("https://swapi.dev/api/films")
            .then((rsvp) => {
                return rsvp.json();
            })
            .then((data) => {
                const transformedMovies = data.results.map((movie) => {
                    return {
                        id: movie.episode_id,
                        title: movie.title,
                        openingText: movie.opening_crawl,
                        releaseDate: movie.release_date,
                    };
                });
                setMovies(transformedMovies);
            });
    }

    return (
        <React.Fragment>
            <section>
                <button onClick={fetchMoviesHandler}>Fetch Movies</button>
            </section>
            <section>
                <MoviesList movies={movies} />
            </section>
        </React.Fragment>
    );
}

export default App;
 

Импорт по умолчанию всегда должен указываться первым, как указано в документации. Вы можете проверить документацию:

Node.js : https://nodejs.org/api/esm.html#import-specifiers

JavaScript: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import