useState 与接口 - 反应本机打字稿

关键词：

【中文标题】useState 与接口 - 反应本机打字稿【英文标题】：useState with interface- react native typescript 【发布时间】：2020-11-18 20:43:58 【问题描述】：

有没有一种方法可以将 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: "");

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

【问题讨论】：

这能回答你的问题吗？ Set types on useState React Hook with TypeScript 是和不是...我会更新我的帖子来解释原因 可以使用联合类型(null) 【参考方案1】：

您可以通过以下方式暗示状态类型：

const [movie, setMovie] = useState<Movie|null>(null);

【讨论】：

反应本机打字稿如何键入 FlatList

】反应本机打字稿如何键入FlatList【英文标题】：ReactnativetypescripthowtotypeFlatList【发布时间】：2021-10-0414:23:23【问题描述】：我找不到在reactnative中键入FlatList的方法exportinterfaceCategoryid:string;title:string;bg:string;exportconstCATEGORIES:Categor... 查看详情

使用打字稿配置本机反应时出错

】使用打字稿配置本机反应时出错【英文标题】：Errorswhenconfiguringreactnativewithtypescript【发布时间】：2019-04-1609:25:49【问题描述】：为了配置我的reactnative项目，我仔细地遵循了这个过程：https://facebook.github.io/react-native/blog/2018/05/0... 查看详情

打字稿和本机反应的 ForwardRef 错误

】打字稿和本机反应的ForwardRef错误【英文标题】：ForwardReferrorwithtypescriptandreact-native【发布时间】：2018-10-2004:17:44【问题描述】：我在使用forwardRef时遇到ts错误//[ts]Property\'forwardRef\'doesnotexistontype\'typeofReact\'.constMyComponent=React.forwa... 查看详情

使用打字稿路径映射时反应本机加载模块错误

】使用打字稿路径映射时反应本机加载模块错误【英文标题】：ReactNativeLoadingModuleerrorwhenusingtypescriptpathmapping【发布时间】：2018-03-1121:18:01【问题描述】：我正在尝试使用typescript路径映射来改进我的导入。目前我有以下源码结构... 查看详情

反应本机打字稿屏幕测试返回测试套件无法运行 AsyncStorage 为空

】反应本机打字稿屏幕测试返回测试套件无法运行AsyncStorage为空【英文标题】：reactnativetypescriptscreentestreturningTestsuitefailedtorunAsyncStorageisnull【发布时间】：2022-01-1116:17:15【问题描述】：我在使用以下URL中的说明为react-nativetypescrip... 查看详情

用打字稿反应上下文

】用打字稿反应上下文【英文标题】：Reactcontextwithtypescript【发布时间】：2020-12-1914:35:48【问题描述】：我想在我的ReactTypescript项目中使用上下文，我该怎么做？我有以下代码：应用.jsimportContextfrom\'context\'constApp=()=>const[value,se... 查看详情

具有 React useState 设置功能的打字稿类型的 Ramda 镜头组合

...1:18:03【问题描述】：我正在学习FP，并试图弄清楚如何在反应中处理事件。例如，让我们使用以下场景：interfaceTodotask:stringdone:booleaninterf 查看详情

如何插入 data.json 以使组件与界面中的所有属性（打字稿）发生反应

...6-1408:47:17【问题描述】：i有一个productpage组件、data.json和接口IProduct。现在，我想使用map函数将data.json中的所有数据获取 查看详情

与打字稿反应的按键事件

】与打字稿反应的按键事件【英文标题】：Keypresseventinreactwithtypescript【发布时间】：2021-06-1405:52:26【问题描述】：大家晚上好，我正在编写一个方法，该方法应在将特定字符（或键）按下到文本框中时插入特定字符串。在这种... 查看详情

在打字稿中将 useState 作为道具传递

】在打字稿中将useState作为道具传递【英文标题】：PassinguseStateaspropsintypescript【发布时间】：2019-09-2511:20:46【问题描述】：假设我有一个带有两个子组件的父组件：constParent=()=>const[myVar,setmyVar]=useState(false)return(<><MyChildCo... 查看详情

打字稿错误类型无法分配给状态 - usestate

】打字稿错误类型无法分配给状态-usestate【英文标题】：Typescripterrortypenotassignabletostate-usestate【发布时间】：2020-08-2503:53:09【问题描述】：我是键入脚本的新手，我正在尝试使用使用状态挂钩和键入脚本来设置响应状态。constinti... 查看详情

如何将scss文件作为变量导入与打字稿反应

】如何将scss文件作为变量导入与打字稿反应【英文标题】：Howtoimportscssfileasvariableinreactwithtypescript【发布时间】：2018-12-0422:01:10【问题描述】：我无法导入以下格式的scss文件。import*asstylesfrom\'./index.scss\';低于error：找不到模块\'.... 查看详情

显示路径中的降价文件与打字稿反应

】显示路径中的降价文件与打字稿反应【英文标题】：Displaymarkdownfilefrompathinreactwithtypescript【发布时间】：2022-01-2400:20:53【问题描述】：我正在尝试在我的react/typescript应用程序中创建一些到不同.md文件的路由。我的App.tsx有这个... 查看详情

打字稿错误未使用 useState 钩子定义

】打字稿错误未使用useState钩子定义【英文标题】：TypescripterrorgotundefinedwithuseStatehook【发布时间】：2021-02-1414:17:41【问题描述】：我是graphql的新手，所以我决定关注这个guide。但是查询时出现错误（第7步）：Argumentoftype\'(__typenam... 查看详情

通过打字稿的界面来反应状态[重复]

...的界面来反应状态，然后渲染状态。但是我不知道如何将接口值传递给反应状态。importReact,useStatefrom\'react\'exportinterfacePersonn 查看详情

与打字稿反应：“历史”类型上不存在属性“推送”

】与打字稿反应：“历史”类型上不存在属性“推送”【英文标题】：ReactwithTypescript:Property\'push\'doesnotexistontype\'History\'【发布时间】：2018-12-1115:22:15【问题描述】：我试图通过推入历史对象来离开视图。但是，当我尝试将路由... 查看详情

无法进入 json 导致打字稿反应

...时候，我不能进去。以下是我设置状态口袋妖怪的方法。接口exportinterfaceIStateid:string;url:string;pokem 查看详情

react-router BrowserRouter与打字稿反应的问题？

】react-routerBrowserRouter与打字稿反应的问题？【英文标题】：issuewithreact-routerBrowserRouterinreactwithtypescript?【发布时间】：2020-01-1309:27:36【问题描述】：我已经经历了几个类似的问题，但找不到有用的东西。我试图从react-router引入Bro... 查看详情