将道具传递给不相关的组件会返回未定义的状态

时间:2019-12-16 16:31:09

标签: javascript reactjs react-props react-proptypes

我具有以下结构:

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

1 个答案:

答案 0 :(得分:1)

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