小编Dan*_*ker的帖子

带有react-hook-form的单选按钮

我用react-hook-form创建了一个表单。它在控制台中正确记录“fullName”和“city”,但不记录单选按钮。使用单选按钮,您会得到结果“null”。

我的代码如下。

import React from 'react'
import './App.css';
import {useForm} from "react-hook-form";

function App() {
    const {register, handleSubmit} = useForm();

    function onSubmitButton(data) {
        console.log(data)
    }

    return (
        <>
            <h1>Order weather</h1>
            <form onSubmit={handleSubmit(onSubmitButton)}>
                <input
                    {...register("fullName")}
                    type="text"
                    name="fullName"
                    placeholder="Name and surname"
                    id="name"
                />
                <input
                    {...register("city")}
                    type="text"
                    name="city"
                    placeholder="City"
                    id="city"
                />
                <p>I would like to:</p>
                <label htmlFor="field-rain">
                    <input
                        {...register("rain")}
                        type="radio"
                        name="weather"
                        value="rain"
                        id="field-rain"
                    />
                    Rain
                </label>
                <label htmlFor="field-wind">
                    <input
                        {...register("wind")}
                        type="radio"
                        name="weather"
                        value="wind"
                        id="field-wind"
                    />
                    Lots of wind
                </label>
                <label htmlFor="field-sun">
                    <input
                        {...register("sun")} …
Run Code Online (Sandbox Code Playgroud)

forms radio-button reactjs react-hook-form

26
推荐指数
1
解决办法
8万
查看次数

标签 统计

forms ×1

radio-button ×1

react-hook-form ×1

reactjs ×1