那些年,React 踩过的坑

1. propTypes 空数组报undefined Warning

举例来说:

import React from 'react';
import { Breadcrumb, Icon } from 'antd';
import PropTypes from 'prop-types'

const BreadcrumbBlock = ({ paths }) => {

  const items = paths.map( (path, index) => (
      <Breadcrumb.Item key={index+1}>
        <span>{path}</span>
      </Breadcrumb.Item>
  ));

  return (
    <Breadcrumb separator='>'>
      <Breadcrumb.Item key="0">
        <Icon type="home"/>
      </Breadcrumb.Item>
      {items}
    </Breadcrumb>
  );
}

Breadcrumb.propTypes = {
  paths: PropTypes.array.isRequired
}

export default BreadcrumbBlock;

如果针对paths =[],则console会报warning:指示paths 的值是undefined,原来如果设置isRequired属性,空值也默认是undefined,去掉后一切正常。

Breadcrumb.propTypes = {
  paths: PropTypes.array
}

猜你喜欢

转载自blog.csdn.net/u011077672/article/details/78874979