React ProptTypes - 对象的对象

Question

我有一个对象,它有动态键(但值是具有相同键的对象):

menu = {
    dogs: {
        name: 'some name1',
        url: 'google.com'
    },
    cats: {
        name: 'some name2',
        url: 'facebook.com'
    },
    parrots: {
        name: 'some name3',
        url: 'linkedin.com'
    }
}

假设我有一个组件:

const Menu = ({menu}) => (
    <div>        
        {
            Object.keys(menu).map(key => (
                <div>{menu.name}</div>
            ))
        }
    </div>
);

如何使用PropTypes验证菜单道具？

Answer 1

你可以使用以下方法做到PropTypes.objectOf():

propTypes: {
  menu: PropTypes.objectOf(
    PropTypes.shape({
      name: PropTypes.string.isRequired,
      url: PropTypes.string.isRequired,
    })
  ).isRequired
}