next.js 如何使用条件逻辑定义主页链接

cuxqih21  于 2022-11-23  发布在  其他
关注(0)|答案(1)|浏览(180)

我试图弄清楚如何定义一个主页链接,如果有一个经过身份验证的用户,则呈现一个页面,如果没有,则呈现另一个页面。
Me是我的函数,检查是否有经过身份验证的用户。到目前为止,它在我的应用程序中工作。
当我尝试:

  1. <HomeLink
  2. href={!me? "/" | "/dash"}
  3. >
  4. <Logo />
  5. </HomeLink>

我收到一个错误消息:
类型'boolean'无法指派给类型'string'。ts(2322)Nav.tsx(147,3):预期的型别来自属性'href',而该属性是在型别'IntrinsicAttributes & HomeLinkProps'上于此处宣告的
我的HomeLinkProps定义为:

  1. interface HomeLinkProps extends LinkProps {
  2. href: string
  3. }
  4. function HomeLink({ href, ...props }: HomeLinkProps) {
  5. const { asPath } = useRouter()
  6. const isActive = asPath === href
  7. return (
  8. <NextLink passHref href={href}>
  9. <Link
  10. px={4}
  11. py={2}
  12. textDecor="none !important"
  13. {...props}
  14. >
  15. {props.children}
  16. </Link>
  17. </NextLink>

我认为它被正确地定义为字符串-href条件中的两个替代项都是字符串-但我不知道如何在Logo字段中表达它。
如何在使主页链接指向一个页面或另一个页面之前添加条件以检查是否有经过身份验证的用户?

khbbv19g

khbbv19g1#

请参阅Conditional (ternary) operator
在条件为真时应执行的表达式后面应该有一个冒号(:)。(不是|
href={!me ? "/" : "/dash"}href={me ? "/dash" : "/"}

相关问题