道具验证反应/道具类型中缺少“孩子”

Question

我知道这已被问过几次，但目前的答案对我没有帮助。

我正在使用auth0进行一些身份验证工作。 我刚刚安装了esLint ，突然间我遇到了我不熟悉的 linting 问题。

现在这段代码：

import React from 'react'
import { useAuth0 } from '@auth0/auth0-react'

const isAuthenticated = () => {
  const { isAuthenticated } = useAuth0()
  return isAuthenticated
}

export function IfAuthenticated({ children }) {
  return isAuthenticated() ? <>{children}</> : null
}

export function IfNotAuthenticated({ children }) {
  return !isAuthenticated() ? <>{children}</> : null
}

收到此错误：

src/components/Authenticated.jsx
  Line 9:35:   'children' is missing in props validation  react/prop-types
  Line 14:38:  'children' is missing in props validation  react/prop-types

我尝试导入PropTypes但这似乎没有帮助（不确定我是否做得对。）

谢谢你的帮助！

Answer 1

您必须在function中声明 propTypes。 请在此处查看更多详细信息

import PropTypes from 'prop-types';

export function IfAuthenticated({ children }) {
  IfAuthenticated.propTypes = {
      children: PropTypes.any
  };

  return isAuthenticated() ? <>{children}</> : null
}

export function IfNotAuthenticated({ children }) {
  IfNotAuthenticated.propTypes = {
      children: PropTypes.any
  };

  return !isAuthenticated() ? <>{children}</> : null
}