Bagaimanakah cara saya memberikan pilihan ini dengan betul dalam bentuk React?

Question

Saya cuba mendapatkan pilihan di bawah APPRAISAL_TYPE untuk dipaparkan pada borang React saya

class Appraisal(BaseModel):
    class APPRAISAL_TYPE(models.IntegerChoices):
        self_appraisal = 1
        line_manager = 2
        coo = 3
    name = models.CharField(max_length=200, blank=True)
    category = models.IntegerField(choices=APPRAISAL_TYPE.choices, default=APPRAISAL_TYPE.self_appraisal)
    description = models.TextField(max_length=200, blank=True)
    appraisal_for = models.ForeignKey(settings.AUTH_USER_MODEL, null=True, on_delete=models.SET_NULL, related_name="re_appraisal_for")
    appraised_by = models.CharField(max_length=200, blank=True)

<InputGroup>
              <InputLeftAddon children="Category" borderRadius="16px" />
              <Select
                name="category"
                value={APPRAISAL_TYPE[appraisalDetails.status]}
                options={categoryOptions}
                onChange={(option) => handleChange(option, "category")}
              />
            </InputGroup>

Walau bagaimanapun, memandangkan kategori ialah medan integer, ia harus digabungkan dengan APPRAISAL_TYPE, jadi saya mendapat ralat menjangkakan integer.

Answer 1

Boleh cuba ni

// 如果这是一个昂贵的操作，可以使用useMemo
let categoryOptions = Object.entries(APPRAISAL_TYPE).map(([key, value]) => {
  //console.log("item", key, value);
  // 修改属性以适应组件所需的选项
  return {
    label: value.label,
    value: parseInt(value.value)
  };
});

// React JSX
 <InputGroup>
      <InputLeftAddon children="类别" borderRadius="16px" />
      <Select
          name="category"
          value={APPRAISAL_TYPE[appraisalDetails.status]}
          options={categoryOptions}
          onChange={(option) => handleChange(option, "category")}
       />
 </InputGroup>

Apakah jenis komponen Select yang digunakan? Sifat kategoriPilihan perlu diubah sewajarnya

Semoga ini membantu anda menyelesaikan masalah anda.