Element-ui select data は数字の表示の問題をエコーし、el-select の検証は失敗し、アラビア数字が表示されます。

初期化パラメータ

return {
      fields: [
        {"title":"景区","id":0},
        {"title":"酒店","id":1}
      ],
      evaluates: [
        {"title":"好评","id":0},
        {"title":"中评","id":1},
        {"title":"差评","id":2}
      ],
}

<el-form-item label="评价" prop="appraise">
          <el-select v-model="form.appraise" placeholder="请选择">
            <el-option
              v-for="evaluate in evaluates"
              :key="evaluate.id"
              :label="evaluate.title"
              :value="evaluate.id"
              clearable
            >
              {
   
   { evaluate.title }}
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="分类" prop="classification">
          <el-select v-model="form.classification"  placeholder="请选择">
            <el-option
              v-for="item in fields"
              :key="item.id"
              :label="item.title"
              :value="item.id"
              clearable
            >
              {
   
   { item.title }}
            </el-option>
          </el-select>
        </el-form-item>

 

 

バックエンドがフロントエンドにデータを送信すると、ドロップダウン ボックスに結果が数値としてエコーされます。

最近問題が発生しました。バックエンドが結果を返した後、フロントエンドの双方向バインディングが結果を数値としてエコーし、原因を分析したところ、データ型に一貫性がないことが判明し、エコー例外が発生しました。

解決

オプションの値を文字型に変換するだけです

1	:value="評価.id+''"

<el-form-item label="评价" prop="appraise">
          <el-select v-model="form.appraise" placeholder="请选择">
            <el-option
              v-for="evaluate in evaluates"
              :key="evaluate.id"
              :label="evaluate.title"
              :value="evaluate.id+''"
              clearable
            >
              {
   
   { evaluate.title }}
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="分类" prop="classification">
          <el-select v-model="form.classification"  placeholder="请选择">
            <el-option
              v-for="item in fields"
              :key="item.id"
              :label="item.title"
              :value="item.id+''"
              clearable
            >
              {
   
   { item.title }}
            </el-option>
          </el-select>
        </el-form-item>