javascript - 如何根据 Json 数组对象检查条件设置默认单选按钮

Question

ReactJs Form Data 应该选择 json ：如果数组对象access.value === true则默认选择该单选按钮，如果我更改可以更改它

应该像下图一样工作：表示根据访问access.value === true设置单选按钮，更改是如果我更改单选按钮

如果我单击提交按钮，则获取是提交，如果我按下取消按钮，则清除

必需：设置值使用钩子 usestate

const data = [
{
  id: 1,
  name: data1,
  access: [
    { name: 'type1', value: false },
    { name: 'type2', value: true },
    { name: 'type3', value: false }
  ]
},
{
  id: 2,
  name: data12,
  access: [
    { name: 'type1', value: false },
    { name: 'type2', value: true },
    { name: 'type3', value: false }
  ]
},
{
  id: 3,
  name: data13,
  access: [
    { name: 'type1', value: true },
    { name: 'type2', value: false },
    { name: 'type3', value: false }
  ]
}
]

const [data, setData] = useState({});
const handleChange = (event) => {
const { name, value } = event.target;
setdata((state) => ({ ...state, [name]: value }));
};


return(
   {data[0].access.map((access) => (
                <RadioGroup
                  row
                  name={data.name}
                  value={[data.name]}
                  onChange={handleChange}
                >
                  <TableCell
                  >
                    <FormControlLabel
                      value={
                        access.name
                      }
                      control={<Radio />}
                      label=""
                    />
                  </TableCell>
                </RadioGroup>
              ))}
  )

标签： javascriptreactjstypescriptformsradio-group