We read every piece of feedback, and take your input very seriously.
To see all available qualifiers, see our documentation.
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
1.5.5
https://codesandbox.io/p/sandbox/tdesign-react-breadcrumb-router-v6-krkvtm
组件 BreadcrumbItem 的 router 和 to 属性仅适用于 Vue,而且 to 的格式完全是按照 Vue Router 的格式来的(文档)。 实际上这两个属性在 React 中很难用得上,毕竟 React 没有类似于 “Router 对象” 这种东西;就算 Next.js 里的 useRouter() 也和这个组件不兼容。
BreadcrumbItem
router
to
useRouter()
参考 Demo:https://codesandbox.io/p/sandbox/tdesign-react-breadcrumb-router-v5-vgc6tt react-router-dom 的 v5 版本,可以使用 useHistory() 获取一个对象(文档),它可以作为 router 参数传,它有 .push(path, [state]) 方法和 .replace(path, [state]) 方法,正好可以兼容此组件,但此时 to 属性也只能支持字符串了。
react-router-dom
useHistory()
.push(path, [state])
.replace(path, [state])
参考 Demo:https://codesandbox.io/p/sandbox/tdesign-react-breadcrumb-router-v6-krkvtm react-router-dom 的 v6 版本开始,删去了 useHistory(),而使用 createBrowserRouter() 时会返回一个对象,这个对象确实可以被看作是 “Router 对象”,但它的 API 又完全不一样了:.navigate(path) 等同于组件源码里的 .push(path),而 .navigate(path, { replace: true }) 等同组件源码里的 .replace(path)。
createBrowserRouter()
.navigate(path)
.push(path)
.navigate(path, { replace: true })
.replace(path)
如果想兼容 react-router-dom@5,to 属性建议改成仅允许传字符串(可以不考虑向前兼容,因为之前的对象用法一定会报错);
react-router-dom@5
如果想兼容 react-router-dom@6,源码里的 .push() 和 .replace() 需要按照上面的 API 格式改成 .navigate(...) 的写法,为了兼容性,可能还需要加个判断条件 if(router.navigate),此时 to 属性也建议只允许字符串。
react-router-dom@6
.push()
.replace()
.navigate(...)
if(router.navigate)
No response
无关
The text was updated successfully, but these errors were encountered:
👋 @jia-niang,感谢给 TDesign 提出了 issue。 请根据 issue 模版确保背景信息的完善,我们将调查并尽快回复你。
Sorry, something went wrong.
No branches or pull requests
tdesign-react 版本
1.5.5
重现链接
https://codesandbox.io/p/sandbox/tdesign-react-breadcrumb-router-v6-krkvtm
重现步骤
组件
BreadcrumbItem
的router
和to
属性仅适用于 Vue,而且to
的格式完全是按照 Vue Router 的格式来的(文档)。实际上这两个属性在 React 中很难用得上,毕竟 React 没有类似于 “Router 对象” 这种东西;就算 Next.js 里的
useRouter()
也和这个组件不兼容。参考 Demo:https://codesandbox.io/p/sandbox/tdesign-react-breadcrumb-router-v5-vgc6tt
react-router-dom
的 v5 版本,可以使用useHistory()
获取一个对象(文档),它可以作为router
参数传,它有.push(path, [state])
方法和.replace(path, [state])
方法,正好可以兼容此组件,但此时to
属性也只能支持字符串了。参考 Demo:https://codesandbox.io/p/sandbox/tdesign-react-breadcrumb-router-v6-krkvtm
react-router-dom
的 v6 版本开始,删去了useHistory()
,而使用createBrowserRouter()
时会返回一个对象,这个对象确实可以被看作是 “Router 对象”,但它的 API 又完全不一样了:.navigate(path)
等同于组件源码里的.push(path)
,而.navigate(path, { replace: true })
等同组件源码里的.replace(path)
。期望结果
如果想兼容
react-router-dom@5
,to
属性建议改成仅允许传字符串(可以不考虑向前兼容,因为之前的对象用法一定会报错);如果想兼容
react-router-dom@6
,源码里的.push()
和.replace()
需要按照上面的 API 格式改成.navigate(...)
的写法,为了兼容性,可能还需要加个判断条件if(router.navigate)
,此时to
属性也建议只允许字符串。实际结果
No response
框架版本
无关
浏览器版本
无关
系统版本
无关
Node版本
无关
补充说明
No response
The text was updated successfully, but these errors were encountered: