javascript - 将 Prop 传递给不相关的组件返回未定义

Question

我有以下结构:

• 文件夹 1
  • 子文件夹 1
    • 文件.jsx
• 文件夹 2
  • 子文件夹 2
    • 子文件夹 2
      • 文件.jsx

将 bool 值作为 Prop 从文件夹 1 的文件传递到文件夹 2 中的文件时，我得到未定义。我的文件夹 2 中的组件已导入到文件夹 1 中，因此它应该可以工作。不使用 Redux 的任何想法都将受到高度赞赏。

文件夹 1 中的组件:

import React from 'react';
import { useAppContext } from 'fusion:context';
import Image from '../../image/default';
import './style.scss';

const Headline = () => {
  const appContext = useAppContext();
  const { globalContent } = appContext;

  return (
    <div className="article-headline text-align">
      <div className="article-headline-body">
        <h3>{globalContent.headlines.basic}</h3>
      </div>
      <Image isFeatured />
    </div>
  );
};

export default Headline;

文件夹 2 中的组件:

import React, { useState } from 'react';
import PropTypes from 'prop-types';
import './default.scss';

const Image = ({ src, global, isFeatured }) => {
  // console.log(global);


  console.log('is featured', isFeatured);

  /* some unrelated code */


}

Image.propTypes = {
  src: PropTypes.any,
  global: PropTypes.any,
  isFeatured: PropTypes.any,
};

export default Image;

Answer 1

PropTypes.any 将返回 undefined 而不是 false，两者在 javascript 中都将变为 false，但您可以设置默认值或将 PropTypes.any 设置为 PropTypes.boolean