在开发需求时遇到后端响应传参是一个对象，并且渲染对象里所有的值，而且在前端开发时会把一些数据以字符串的形式传过去，但是有时候会有以一个数组里有多个对象的形式，把参数传过去也是经过摸索，终于时成功了

首先我们看下需求：

1.调接口正确实现动态渲染利率的各个信息？

2.前端开发时会把一些数据以字符串的形式传过去，但是有时候会有以一个数组里有多个对象的形式，把参数传过去？

需求一 ：

我们调完接口发现返回的参数是这样的形式：

对象里的每一项都不是固定的每一条对象里面的每一项都是不同的而且要求显示把每一项都渲染出来这时候就会难到我们了！ 

1. volComparableCompanies: Object
   1. 86.SZ: 0.13
   2. 48.SZ: 0.15
   3. 08.SH: 0.12
   4. 19.SH: 0.10

解决方案一： 

我这个使用的element ui组件渲染的，大家可以拿过去修改一下使用

<el-col :span="12"  v-for="(value, key, index)  in volatility " :key='index'>
                  <!-- v-for="(value, key, index) in volatility" -->
                  <el-popover
                    placement="top-start"
                    width="100"
                    trigger="hover"
                    @show="handleStatus(key)"
                    :content="codechinesename">
                      <el-form-item  :label="key" slot="reference">
                <!-- v-model="marketParam.volatility" -->
                        <el-input
                          :value="value"
                          readonly
                        ></el-input>
                      </el-form-item>
                  </el-popover>
              
              </el-col>

                                                声明了一个变量叫 volatility

 

volatility:null,

这是table表格每天数据的触发事件

 

通过点击事件拿到总数据里的voicomparablecompanies赋值到return里面声明的变量volatility

                                        

this.volatility=row.volComparableCompanies

最终的结果就成了：

解决方案二：

                                                声明变量为一个数组volatilitydata

volatilitydata:[],

这是table表格每天数据的触发事件

                        ​​​​​​​        ​​​​​​​        ​​​​​​​        

     通过点击事件拿到总数据里的voicomparablecompanies赋值到push到里面声明的变量volatilitydata这个数组中，通过foreach的形式拿到数组里的每一项也就是数组里的对象，通过for...in的方式拿到每一个对象里的key值将每一项的item[key]赋值到return里面声明的变量volatility这个拿到的是值，直接将key赋值到return里面声明的变量volatility这个拿到的是键！

 

this.volatilitydata.push(row.volComparableCompanies)
      console.log(row);
      console.log(row.volComparableCompanies);
      this.volatilitydata.forEach((item,index)=>{
      for (const key in item) {
        // restictedEquity
        this.marketParam.volatility=item[key]
        console.log("item[key]",item[key]);//值
        console.log("key",key);//键
        // this.blurHandle(key)
      }

 

 最终的结果就成了：

 

需求二 ：

解决方案：

js构造json 数组就可以解决

var list= [];
for (var i = 0; i < goodsList.length; i++) {
	var obj = {};
	list.star_num = '';
	list.content = '';
	list.imglist = '';
	list.goods_id = '';
	list.rec_id = '';
	list.push(obj);
}
console.log(list);

                                                        多用于这种类型的传参 

 

                                        其实关键的部分就只有中间的部分 

let data=[]
            var obj = {
                  referTicker:this.dataForm.referTicker,
                  referCnName:this.codechinesename,
                  ticker:this.dataForm.ticker,
                  };
                  data.push(obj);
            for (var i = 0; i <this.boxcollection.length; i++) {
                  var obj = {
                  referTicker:this.boxcollection[i].code,
                  referCnName:this.newchinesename[i],
                  ticker:this.dataForm.ticker,
                  };
                  data.push(obj);
                }

这样就按照一个数组里有多个对象的方式传过去了

 

 

 这样的就可以了！！！