反应：作为道具的数组显示为未定义

Posted 2023-02-23

【中文标题】反应：作为道具的数组显示为未定义

【英文标题】：React: array as props shows as undefined

【发布时间】：2020-12-22 03:08:27

【问题描述】：

我正在尝试将名为 myitems 的数组作为道具传递给子组件，但我收到一条错误消息，指出 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;

【参考方案1】：

您没有将 options 属性传递给 second Dropdown 实例，这就是您收到错误的原因

<Dropdown
  className="add__category"
/>