Question

我正在尝试将“服装”的尺寸发送到另一页，但这只是给我未定义的内容

这是我的product.js：

const [ pickSize, setPickSize ] = useState('');

<SelectSizesForm onSubmit={() => props.addBasket({ title, price, img_url1, pickSize })}>
    <SizeLabel>
        <SizeInput type="radio" name="pickSize" value="M" />
        <SizeSpan className="size">M</SizeSpan>
    </SizeLabel>
    <SizeLabel>
        <SizeInput type="radio" name="pickSize" value="L" />
        <SizeSpan className="size">L</SizeSpan>
    </SizeLabel>
    <SizeLabel>
        <SizeInput type="radio" name="pickSize" value="XL" />
        <SizeSpan className="size">XL</SizeSpan>
    </SizeLabel>
    <BuyButton type="submit">Add to Cart</BuyButton>
</SelectSizesForm>

如何以这种形式发送pickSize？

Answer 1

您可以跟踪选择的更改，以更改pickSize的状态值，如下所示：

const [ pickSize, setPickSize ] = useState('');

onChange = (value) = {
    setPickSize(value);
}

<SelectSizesForm onSubmit={() => props.addBasket({ title, price, img_url1, pickSize })}>
    <SizeLabel>
        <SizeInput onChange={() => onChange("M")} type="radio" name="pickSize" value="M" />
        <SizeSpan className="size">M</SizeSpan>
    </SizeLabel>
    
    ...
</SelectSizesForm>

如何将数据从表单发送到另一个页面？

1 个答案: