我的代码在添加呈现后给出了一个NaN结果,您知道为什么吗?
const Total = (props) => {
return (
<div>
<p>Number of exercises {props.exercises1 + props.exercises2 + props.exercises3}</p>
</div>
)
}
const App = () => {
const course = 'Half Stack application development'
const part1 = {
name: 'Fundamentals of React',
exercises: 10
}
const part2 = {
name: 'Using props to pass data',
exercises: 7
}
const part3 = {
name: 'State of a component',
exercises: 14
}
return (
<div>
<Total exercise1={part1.exercises} exercises2={part2.exercises} exercises3={part3.exercises} />
</div>
)
}
export default App页面看起来像这个
半堆栈应用程序开发
反应基本原理10
使用道具传递数据7
构成部分14的状态
练习次数NaN <- NaN
发布于 2022-01-07 13:31:11
这是因为您已经将exercise1、exercise2、exercise3作为道具传递给了它们,但是访问它们的方式是props.exercises1、props.exercises2、props.exercises3。注意节选中的额外部分。
因此,它是未定义的,当您尝试添加未定义的Js时,返回NaN。
发布于 2022-01-07 13:34:08
将未定义的props.exercises1添加到其他练习中,您的道具名为props.exercise1
https://stackoverflow.com/questions/70621951
复制相似问题