Elementui渲染问题

前言

本博客记录一些我个人在使用elemenui时渲染数据遇到的问题

---

一、数据需要转化为数组形式

1.官方el-table代码

 官方el-descriptions代码

    kooriookami
    18100000000
    苏州市
    
      学校
    
    江苏省苏州市吴中区吴中大道 1188 号

2.在data属性中传入数据出现以下报错

说明需要转换数据类型

3.转换方法

import axios from 'axios';
import { ReqUserInfoByUserId } from "../../request/index.js";
export default {
  data() {
    return {
      selfInfo:[],
         };
  },
  created() {
  
       ReqUserInfoByUserId({ 
         id: '13f897e1fc7849a984de24eba92bf4ff'
        }).then((res)=>{
           
            this.selfInfo.push(res.data)

        }).then((erro)=>{
          console.log(erro)
        })
        
    },
    
  }

在data中定义数组类型 selfInfo，在获取数据中this.selfInfo.push(res.data)进行转换传入

二、具体渲染

1.观察数据

 

2.渲染数据

el-table在data改为所定义数据名并在prop处写上需要渲染的字段名即可

el-descriptions没有data属性,使用{{}}渲染，注意数组类型所选字段所在下标索引

       
      
{{ selfInfo[0].role.desc }}
      
      

三、属性查看

官方文档所选属性页面最下方

---