Обеспечение соответствия каждого элемента массива пользовательской форме в React (снова)

Ошибка, которую я пытаюсь обойти: Warning: Failed prop type: checker is not a function

У меня есть очень похожий вопрос, размещенный здесь: in-react">Убедиться, что каждый элемент свойства массива соответствует пользовательской форме в React

Вот объект, который я пытаюсь проверить

Объект, который я пытаюсь добавить, сложен, и я не могу понять правильный синтаксис.

Вот что я пробовал:

Card.propTypes = {
  node: shape({
    images: PropTypes.arrayOf(PropTypes.objectOf(PropTypes.shape({
      entity: PropTypes.shape({
        image: PropTypes.shape({
          derivative: PropTypes.shape({
            url: PropTypes.string,
          }),
        }),
      }),
      mid: PropTypes.number,
    }))),
    title: PropTypes.string,
    body: {
      value: PropTypes.string,
    },
  }).isRequired,
  ctaHandler: PropTypes.func.isRequired,
  deleteHandler: PropTypes.func.isRequired,
};

Кажется, что эта проблема тоже похожа - числа как ключи. React PropTypes — форма с числами в качестве ключей

Также пробовал это:

Card.propTypes = {
  node: PropTypes.shape({
    author: PropTypes.string,
    body: {
      value: PropTypes.string,
    },
    images: PropTypes.arrayOf(PropTypes.shape({
      entity: PropTypes.shape({
        image: PropTypes.shape({
          derivative: PropTypes.shape({
            url: PropTypes.string,
          }),
        }),
      }),
      mid: PropTypes.number,
    })),
    nid: PropTypes.number,
    title: PropTypes.string,
    uuid: PropTypes.string,
  }).isRequired,
  ctaHandler: PropTypes.func.isRequired,
  deleteHandler: PropTypes.func.isRequired,
};

Я также попытался сопоставить свой объект модели, возвращенный с моего сервера GraphQL, с чем-то менее сложным.

  let nodes = result.nodes.entities.map(node => { 
    const newNode = {...node};
    newNode.images = newNode.images.map(image => {
      return {url: image.entity.image.derivative.url, mid: image.mid};
    })
    return newNode;
  });
  this.setState({
    nodes: nodes
  });

который, по-видимому, должен дать мне следующую подпись:

Card.propTypes = {
  node: PropTypes.shape({
    author: PropTypes.shape({
      name: PropTypes.string,
    }),
    body: {
      value: PropTypes.string,
    },
    images: PropTypes.arrayOf(PropTypes.shape({
      url: PropTypes.string,
      mid: PropTypes.number,
    })),
    nid: PropTypes.number,
    title: PropTypes.string,
    uuid: PropTypes.string,
  }).isRequired,
  ctaHandler: PropTypes.func.isRequired,
  deleteHandler: PropTypes.func.isRequired,
};

К сожалению, я все еще получаю ту же ошибку: Failed prop type: checker is not a function in Card


person Justin Levi Winter    schedule 14.02.2018    source источник


Ответы (1)


Если у вас есть Warning: Failed prop type: checker is not a function, возможно, это опечатка в объявлении propTypes. Вот почему он показывает это в этом случае, у вас есть:

body: {
    value: PropTypes.string,
},

Так должно быть

body: PropTypes.shape({
 value: PropTypes.string,
}),
person muzykolog84    schedule 11.03.2018