javascript - 我想用 json 数据填充单选按钮输入

Question

我有一些数据想用来填充单选按钮，但某些数据长度比其他数据长，并且如果长度只有一个，则不希望出现空按钮。我可能想太多了，但我很糟糕。

我尝试通过 props.size 数据进行映射，这样我就可以以这种方式填充它，但我收到一条错误消息，指出 map 不是函数。

这是我的按钮文件:

import React from "react";

const EyewearPurchaseBtn = (props) => (
    <div>
        <form className="eyewear-purchase-form">
            <h3>Select Size</h3>
                <div>
                    <input className="radio-btn" type="radio" checked="checked"/>
                    <label className="eyewear-purchase-label">{props.sizes}</label><br/>

                    <input className="radio-btn" type="radio" />
                    <label className="eyewear-purchase-label">Two</label><br/>

                    <input className="radio-btn" type="radio" />
                    <label className="eyewear-purchase-label">Three</label><br/>

                    <input className="radio-btn" type="radio" />
                    <label className="eyewear-purchase-label">Four</label>


                <button onClick={props.handlePurchaseEvent} className="buy-now">Buy Now</button>
            </div>
        </form>
    </div>
);

export default EyewearPurchaseBtn;

Answer 1

I've tried mapping through the props.size data so I could just populate it that way but I get an error that says map is not a function.

此错误意味着您尝试在没有可用函数的对象上调用函数(在本例中为 map)。这通常是出于以下两个原因之一:

1. 您的姓名拼写错误或大小写错误
2. 您调用函数的对象不是您所期望的(即类型错误)

在这种情况下，几乎可以肯定是后者:您调用 map 的任何数据都不是数组。也许它是 null 或 undefined，或者它是不同类型的对象。您尚未共享该代码，因此无法确定。