状态上不存在该属性-将React Router挂钩与TypeScript一起使用

劳拉·贝娅特丽丝(Laura Beatris):

使用react-router-dom挂钩+ TypeScript时遇到一些问题。

尝试访问某些状态属性将给出错误消息,指出该属性不存在

参考:

在此处输入图片说明

为了继续开发,我必须采取的解决方法之一就是将其投放到 any

 const location = useLocation() as any;

如何在不发出警告的情况下将有效接口传递给useLocation泛型,以访问状态属性?

  useDidMount(() => {
    if (location.state?.newTransactions) {
      scroll.scrollToBottom();
    }
  });
TJ Crowder:

useLocation接受用于确定state属性类型的通用参数,因此:

const location = useLocation<YourStateTypeHere>();

例如:

interface LocationState {
    newTransactions?: boolean;
}

// ...
const location = useLocation<LocationState>();

// ...
useDidMount(() => {
    if (location.state?.newTransactions) {
        scroll.scrollToBottom();
    }
});

我如何到达那里的(因为我以前从未使用过),以防万一它有用:我知道大多数钩子的TypeScript绑定至少实现了一个通用参数,所以当我看到React Router location包含了程序员定义的状态时,我认为它可能接受了。因此,我打开了一个使用React Router和TypeScript的项目,并将鼠标悬停useLocation在代码中。果然,弹出窗口显示了一个通用参数,该参数已应用于该state属性。结果!

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

使用React 16的类型'DetailedHTMLProps,HTMLDivElement>'不存在该属性

Reactjs,Typescript-子组件上不存在该属性

React组件中的TypeScript TS2339错误:类型“ IntrinsicAttributes ...”上不存在属性“ xyz”

使用recompose定义时,React组件上不存在该属性

TS2339:移植到Typescript时,类型'typeof React'上不存在属性'PropTypes'

类型/ IntrinsicAttributes和IntrinsicClassAttributes上不存在React Typescript属性

具有typescript的react.js,状态的类型对象错误不存在属性

Typescript + React + Redux + reactrouter:“属性在IntrinsicAttributes和IntrinsicClassAttributes类型上不存在”将道具从父级传递到子级

与角度打字稿一起使用时,属性'ClassList'在'GlobalEventHandlers'类型上不存在

React Typescript自定义挂钩:类型“ {}”上不存在属性“ prop_name”

属性“位置”在类型“只读<{}>”上不存在-React Router和Typescript

在UI上对数据进行排序和渲染无法与React挂钩一起使用

使用React Typescript的状态:类型'IntrinsicAttributes和IntrinsicClassAttributes不存在属性

类型“ {}”上不存在属性“背景”-React Router模态

为什么将floatThead与Angular / TypeScript一起使用会产生错误属性'floatThead'在类型'JQuery <any>'中不存在

TypeScript属性“ value”在类型“ HTMLElement”上不存在。React Jest测试

属性'ref'在类型'A'上不存在。ts(2339)-React,TypeScript

TypeScript错误-React Mui MenuItem上不存在属性组件

React&Typescript:类型“ number”上不存在属性“ id”

属性“名称”在类型“ EventTarget”上不存在-React + TypeScript

使用TypeScript的Phaser上的联合类型上不存在该属性

TypeScript React中的可重用布局组件:类型“ IntrinsicAttributes&IProps”上不存在属性“路径”

将匿名函数与D3 SVG符号一起使用时,“类型{}上的属性不存在”错误

React-TypeScript:类型“IntrinsicAttributes 和 IntrinsicClassAttributes<GoogleMapReact> 上不存在属性“位置”

React TypeScript & ForwardRef - 类型“IntrinsicAttributes”上不存在属性“ref”

如何删除 React Typescript 中类型“{}”上不存在的属性“长度”

数组映射期间类型上不存在 React Typescript 属性

类型“{}”上不存在属性“道具”(试图访问子项的道具)-React Typescript

在 React / Typescript 中上传文件->“从不”类型上不存在属性“点击”