useState with interface-反应本机打字稿

Question

有一种方法可以将 useState 与接口类型一起使用吗？

这就是我想做的：

const [movie, setMovie] = useState(null);

[...]

.then((responseJson) => {

            var movie: Movie = {

                id : id,

                title: responseJson.original_title,

                backdrop: "https://image.tmdb.org/t/p/original" + responseJson.backdrop_path,

                note: responseJson.vote_average,

                numberNote: responseJson.vote_count,

                year: responseJson.release_date,

                runtime: responseJson.runtime,

                genre: responseJson.genres,

                plot: responseJson.overview,

            };

            setMovie(movie);

        })

但是类型有错误。

我的界面：

interface Movie {

    id: number;

    title: string;

    backdrop: string;

    note: number;

    numberNote: number,

    year: number,

    runtime: number,

    genre: {id: number, name: string}[],

    plot: string

}

根据这篇文章：Set types on useState React Hook with TypeScript。

我可以尝试做这样的事情：

const [movie, setMovie] = useState<Movie>({id: 0,

        title: "",

        backdrop: "",

        note: 0,

        numberNote: 0,

        year: 0,

        runtime: 0,

        genre: [{id: 0, name: ""}],

        plot: ""});

但它看起来并不干净，我认为这不是将随机值置于第一状态的好解决方案。

Answer 1

您可以通过以下方式暗示状态类型：const&nbsp;[movie,&nbsp;setMovie]&nbsp;=&nbsp;useState<Movie|null>(null);