Cómo se convierten los datos de objetos en una matriz


prefacio

A veces, los datos proporcionados por el backend en el proyecto no pueden cumplir completamente con los requisitos de datos del frontend.Por ejemplo, en la cartera de proyectos de element-ui+vue, los datos en el cuadro desplegable tienen la forma de una matriz. Sin embargo, los colegas del back-end son de hecho datos de objetos. Por supuesto, puede negociar con el back-end para cambiarlo a los datos que desee... Pero esto suele ser problemático. El front-end al que le gusta escribir código en silencio. decide convertirlo por sí mismo.


提示:正文内容

1. Los datos proporcionados por el backend

inserte la descripción de la imagen aquí

2. Cómo convertir

			console.log('res:', res);
            let resObj = res.data.data; //获取后台给的对象数据
            let arr = []; //定义一个空数组
            for (let key in resObj) {
    
    
            //用for循环转换resObj对象
              arr.push({
    
    
                value: key,
                label: resObj[key]
              });
            }
            this.deviceList = arr; //将改数组赋值给数组deviceList,渲染到页面上
		  <el-form-item
              label="报警类型"
              prop="roomNumber"
            >
              <el-select
                placeholder="请选择"
                clearable
                default-first-option
                v-model="formInline.alarmDeviceType"
                @change="onSearch"
              >
                <el-option
                  v-for="(list,k) in deviceList"  //将数组渲染到页面上
                  :key="k"
                  :label="list.label"
                  :value="list.value"
                ></el-option>
              </el-select>
            </el-form-item>

3. Resultado final

inserte la descripción de la imagen aquí
Eso es todo por compartir, si te ayuda no olvides darle me gusta!

Supongo que te gusta

Origin blog.csdn.net/daishu_shu/article/details/124316621
Recomendado
Clasificación