Reactjs 如何发送单选按钮'；将值设置为状态，并在单击另一个单选按钮时更改该值

我正试图将组件中选定单选按钮的值推入页面上的状态，这样，当选择另一个单选按钮时，它会用新选择的值更新状态中的值。
问题是，每当我更改所选单选按钮时，它都会添加一个新值，而不是更新它

这是我的页面

import React, { useContext, useState, useEffect } from 'react';
import { Form, Button, Popconfirm, Icon, Input, Radio, Collapse, Checkbox } from 'antd';
import Axios from 'axios';
import CompanyContext from '../util/UserContext';
import renderEmpty from 'antd/lib/config-provider/renderEmpty';
import InputOnly from '../components/InputOnly';
import CustomInput from '../components/Input';
import Lampiran from '../components/Lampiran';
import CustomCheckBox from '../components/CheckBox';

export default function Hitung() {

    let [loading, setLoading] = useState(false);
    let [form, setForm] = useState([]);
    let [soal, setSoal] = useState([]);
    let [pilihan, setPilihan] = useState([]);
    let [test, setTest] = useState([1, 2, 3, 4, 5]);
    let [answer, setAnswer] = useState("");

    let [coba, setCoba] = useState([]);
    let [coba2, setCoba2] = useState([]);

    const company = useContext(CompanyContext);
    let answertemp = []

    useEffect(() => {
        async function getData() {
            try {
                let data = await Axios.get('http://localhost:5000/lelang/getquestion');
                setSoal(data.data.pertanyaan);
            }
            catch (e) {
                console.log(e);
            }
        }
        getData();
    }, []);

    function onAnswer(data) {
        answertemp.push(data);
        console.log(answertemp);
    }




    function RenderQuestion() {
        if (soal.length != 0) {
            return soal.map(data => {
                switch (data.type_question) {
                    case "input":
                        return (<CustomInput data={data} onAnswer={onAnswer} />)
                    case "input_only":
                        return (<InputOnly data={data} onAnswer={answer => {
                            if(coba.length!=0){
                                for(let i =0;i<coba.length;i++){
                                    if (coba[i].id_question===answer.id_question){
                                        coba[i].answer=answer.answer;
                                        break;
                                    }
                                    else if (i<coba.length-1){
                                        continue;
                                    }
                                    else{
                                        setCoba([...coba,answer])
                                    }                       
                                }
                            }
                            else{
                                console.log('add');
                                setCoba([...coba,answer])
                            }

                        }} />)
                    case "lampiran":
                        return (<Lampiran data={data} onAnswer={onAnswer} />)
                    case "checkbox":
                        return (<CustomCheckBox data={data} onAnswer={onAnswer} />)
                }
            })
        }
        else {
            return (<h2 style={{ textAlign: "center" }}>Loading....</h2>)
        }
    }


    //insert_answer

    async function submit(e) {
        setAnswer(answertemp)
        setLoading(true);
        e.preventDefault();
        try {
            const token = await Axios.post('http://localhost:5000/lelang/insert_answer', company.data);

        }
        catch (e) {
            alert("error " + e)
        }
        setLoading(false);
    }

    return (
        <div>
            <h1 style={{ textAlign: 'center' }}>Input Penilaian {company.data}</h1>
            <div style={{ padding: '30px' }}>
                <Form>
                    {RenderQuestion()}
                    <button onClick={() => console.log(coba)}>Simpan</button>
                </Form>
            </div>
        </div>
    );
}

import React，{useContext，useState，useffect}来自“React”；
从“antd”导入{表单、按钮、Popconfirm、图标、输入、单选、折叠、复选框}；
从“Axios”导入Axios；
从“../util/UserContext”导入公司上下文；
从“antd/lib/config provider/rendermpty”导入rendermpty；
从“../components/InputOnly”导入InputOnly；
从“../components/Input”导入CustomInput；
从“../components/Lampiran”导入Lampiran；
从“../components/CheckBox”导入CustomCheckBox；
导出默认函数Hitung（）{
let[loading，setLoading]=useState（false）；
让[form，setForm]=useState（[]）；
let[soal，setSoal]=useState（[]）；
让[pilihan，setPilihan]=useState（[]）；
let[test，setTest]=useState（[1,2,3,4,5]）；
let[answer，setAnswer]=useState（“”）；
让[coba，setCoba]=useState（[]）；
让[coba2，setCoba2]=useState（[]）；
const company=useContext（CompanyContext）；
让answertemp=[]
useffect（（）=>{
异步函数getData（）{
试一试{
让数据=等待Axios.get（'http://localhost:5000/lelang/getquestion');
setSoal（data.data.pertanyan）；
}
捕获（e）{
控制台日志（e）；
}
}
getData（）；
}, []);
回答功能（数据）{
应答温度推送（数据）；
控制台日志（answertemp）；
}
函数RenderQuestion（）{
如果（总长度！=0）{
返回soal.map（数据=>{
开关（数据类型\问题）{
案例“输入”：
返回（）
案例“仅输入”：
报税表（{
如果（coba.长度！=0）{
对于（设i=0；iSimpan）
);
}

这是组件

import React, { useContext, useState, useEffect } from 'react';
import {  Radio, Input, Form } from 'antd';


export default function CustomInput (props){
    let[radioInput,setRadioInput]=useState({});
    let[chooseInput, setChooseInput] = useState();
    useEffect(()=>{
        setRadioInput(props.data);
    },[]);



    return (
        <div>
        <p style={{fontWeight:"bold"}}>{radioInput.question}</p>
        <Form.Item required>
            <Radio.Group 
             options = {radioInput.variable}
             onChange={(data) => props.onAnswer(data.target.value)}
             onClick={data => props.onAnswer(data.radioInput.value)}
             >

            </Radio.Group>
            </Form.Item>
        </div>
    )
}

import React，{useContext，useState，useffect}来自“React”；
从“antd”导入{Radio，Input，Form}；
导出默认功能CustomInput（道具）{
let[radioInput，setRadioInput]=useState（{}）；
让[chooseInput，setChooseInput]=useState（）；
useffect（（）=>{
设置放射性输入（道具数据）；
},[]);
返回(
{radioInput.question}
props.onAnswer（data.target.value）}
onClick={data=>props.onAnswer（data.radioInput.value）}
>
)
}

您需要传递有效的依赖项来侦听更改。在依赖项中发送空数组时，钩子将仅在第一次渲染时发生。在您的情况下，将使用效果更改为

useEffect(()=>{
    setRadioInput(props.data);
},[props.data]);

---

我已经更改了useEffect，但它仍然为状态添加了新的值，而不是更改它