USState与界面反应的本地打字稿

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
}

根据这篇文章：用TypeScript在useState React Hook上设置类型。

我可以尝试这样做：

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 [movie, setMovie] = useState<Movie|null>(null);