Javascript 如何在React中正确操作无线电输入元素中的选中属性

基本上，我正在尝试根据所选的进程VC属性设置选中的属性（用于无线电输入的属性）。但它不起作用。你们知道如何让它正常工作吗

组成部分：

import React, { useState } from "react";
import "./styles.css";

const App = () => {
  const processes = [
    { id: 1, VC: true },
    { id: 2, VC: false },
    { id: 3, VC: false },
    { id: 4, VC: true }
  ];
  const [selectedProcess, setSelectedProcess] = useState("");
  return (
    <div className="App">
      <h1>Radio</h1>
      <select
        className="form-control"
        onChange={(e) => setSelectedProcess(e.target.value)}
      >
        <option></option>
        {processes.map((process) => (
          <option key={process.id} value={process.id}>
            {process.id}
          </option>
        ))}
      </select>
      <input
        id="customCheck1"
        type="checkbox"
        className="custom-control-input"
        checked={selectedProcess !== "" ? selectedProcess.VC : false}
        name="VC"
      />
      <label className="custom-control-label" htmlFor="customCheck1">
        Vacuum
      </label>
    </div>
  );
};

export default App;

如您所见，默认情况下，我将其设置为false，如果我选择一个进程，例如id为4，则应检查无线电输入。如果需要，我在CodeSandbox中有代码：

---

您的

选项的
值
是
进程。id
不是进程本身。因此，
selectedProcess
将是
'
，
1
，
2
，
3
或
4
。因此，
selectedProcess.VC
始终是未定义的。您需要像
checked={selectedProcess！=''？selectedProcess:false}
这样进行检查，它才能工作

我建议这样做：
checked={！！selectedProcess}

checked={selectedProcess !== "" ? selectedProcess.VC : false}