失败的道具类型:没有指定所需的道具

React Redux Failed prop type: Required prop was not specified

本文关键字:类型 失败      更新时间:2023-09-26

我遇到了一些问题,失败的道具类型试图学习Redux与反应。事情是我想创建一个带有标题和一些文本的注释,但由于Failed prop类型只有标题将显示。

警告:

warning.js:36 Warning: Failed prop type: Required prop `notes[0].text` was not specified in `NoteList`.
in NoteList (created by Connect(NoteList))
in Connect(NoteList) (created by App)
in div (created by App)
in App
in Provider
warning.js:36 Warning: Failed prop type: Required prop `text` was not specified in `Note`.
in Note (created by NoteList)
in NoteList (created by Connect(NoteList))
in Connect(NoteList) (created by App)
in div (created by App)
in App
in Provider


ListNotes.js:

import { connect } from 'react-redux'
import NotesList from '../components/NotesList'
const mapStateToProps = (state) => {
    return {
        notes: state.notes
    }
}
const ListNotes = connect(
    mapStateToProps
)(NotesList)
export default ListNotes


NotesList.js:

import React, { PropTypes } from 'react'
import Note from './Note'
const NoteList = ({ notes }) => {
    return (
        <ul>
            {notes.map(note =>
                 <note
                     key={note.id}
                     {...note}
                 />
            )}
        </ul>
    )
}

NoteList.propTypes = {
    notes: PropTypes.arrayOf(PropTypes.shape({
        id: PropTypes.number.isRequired,
        title: PropTypes.string.isRequired,
        text: PropTypes.string.isRequired
    }).isRequired).isRequired
}
export default NoteList


Note.js:

import React, { PropTypes } from 'react'
const Note = ({title, text}) => {
    return (
        <li>
            <h1>{title}</h1>
            <p>{text}</p>
        </li>
    )
}
Note.propTypes = {
    title: PropTypes.string.isRequired,
    text: PropTypes.string.isRequired
}
export default Note

检查state.notes中的内容。你可以记录它,或者在某处设置一个断点,然后使用浏览器的调试器。

似乎该数组中的对象没有text属性或设置为undefinednull。您可能在应该设置该值的地方出现了错别字。

如果你能看到标题,那么其他一切似乎都井然有序。