React Redux 失败道具类型:未指定必需的道具
React Redux Failed prop type: Required prop was not specified
我在尝试通过 React 学习 Redux 时遇到了失败的道具类型的问题。
问题是我想创建一个带有标题和一些文本的注释,但是由于失败的道具类型,只有标题会显示。
警告:
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
中的内容。您可以记录它或在某处设置断点并使用浏览器的调试器。
似乎那个数组中的 objects 没有 text
属性 或者它被设置为 undefined
或 null
。您可能在应该设置该值的地方输入错误。
如果您看到标题,那么其他一切似乎都正常。
我在尝试通过 React 学习 Redux 时遇到了失败的道具类型的问题。 问题是我想创建一个带有标题和一些文本的注释,但是由于失败的道具类型,只有标题会显示。
警告:
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
中的内容。您可以记录它或在某处设置断点并使用浏览器的调试器。
似乎那个数组中的 objects 没有 text
属性 或者它被设置为 undefined
或 null
。您可能在应该设置该值的地方输入错误。
如果您看到标题,那么其他一切似乎都正常。