javascript - 如何通过 radio 输入在 react 中传递多个值

Question

我想在选中行中的单选按钮时将表中整行的值传递给函数。这是表格代码

<table className="table table-bordered table-stripped">
                <thead>
                    <th>AD Type</th>
                    <th>AD Title</th>
                    <th>Image/Video URL</th>
                    <th>Video Thumbnail</th>
                    <th>Landing URL</th>
                    <th>Placement</th>
                    <th>Country</th>
                    <th>DSP</th>
                    <th>Select</th>
                </thead>
                <tbody>
                    {
                        creative.map(
                            creative =>
                            <tr key = {creative.id}>
                                <td>{creative.ad_type}</td>
                                <td>{creative.ad_title}</td>
                                <td>{creative.image_url}</td>
                                <td>{creative.video_thumbnail}</td>
                                <td>{creative.landing_url}</td>
                                <td>{creative.placement}</td>
                                <td>{creative.country}</td>
                                <td>{creative.dsp}</td> 
                                <td> <input type="radio" class="checkbox1" id="chk" name="check[]" value={creative} onClick={func1} /></td>
                            </tr>
                        )
                    }
                </tbody>
            </table>

函数 func1 只是记录值

const func1 = (e) => {
    console.log(e.target.value);
}

当我使用 value = {creative} 时，记录的输出是 [object Object]。我什至尝试使用 value = {creative.ad_type, creative.ad_title} 但它只记录最后一个值，在本例中为 creative.ad_title。我想记录 creative 对象的所有值。

Answer 1

您可以使用JSON.stringify()将对象值转为JSON格式。

例如:

value{ JSON.stringify(creative) }

然后你尝试获取你需要用 JSON.parse() 解析它的值

const func1 = (e) => {
  console.log(JSON.parse(e.target.value);
}