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

我有以下结构：


资料夹1


子文件夹1


File.jsx


资料夹2


子文件夹2


子文件夹2


File.jsx





当从文件夹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;

最佳答案

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