如何解决反应:数组作为道具显示为未定义
我试图将名为myitems
的数组作为prop传递给子组件,但是我收到一条错误消息,指出options
在子组件中未定义。不知道这是怎么回事。任何帮助将不胜感激。
子组件:
import React from 'react';
const Dropdown = ({className,options}) => {
return (
<>
<select className={className}>
{options.map((el,i) => (<option key={i}>{el.type}</option>))}
</select>
</>
)
}
export default Dropdown;
父组件:
import React from 'react';
import Dropdown from './Dropdown'
const BudgetInput = ({ descValue,budgetValue,onDescChange }) => {
const myItems = [{ type: '+' },{ type: '-' }];
return (
<>
<Dropdown
className="add__type"
options={myItems}
/>
<input
type="text"
className="add__description"
placeholder="Add description"
value={descValue}
onChange={onDescChange}
/>
<input
type="number"
className="add__value"
placeholder="Value"
value={budgetValue}
//onChange={}
/>
<Dropdown
className="add__category"
/>
<button onClick={handleInput}>Enter</button>
</>
)
}
export default BudgetInput;
解决方法
您没有将options
道具传递给 second Dropdown
实例,这就是为什么会出现错误的原因
<Dropdown
className="add__category"
/>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。