vue前端接收后端传过来的带list集合的数据

前后端交互,如下的示例Json报文,前端采用vue进行接收.

{
	rootId: '',
	nodes: [],
	lines: []
}

1、前端接收响应结果

//在vue的调用方法体内,调后端的接口,获取响应数据,复制给前端定义的Json对象,拿去做处理
selectDemoResult(this.queryParams).then( rep => {
  const __jsonData = {
    rootId: '',
    nodes: [],
    lines: []
  };
  __jsonData.rootId = rep.data.rootId;
  __jsonData.nodes = rep.data.nodes;
  __jsonData.lines = rep.data.lines;
  // console.log(jsonData)
  //拿着__jsonData去做处理即可
});

2、后端组装响应结果

/**
 * 给前端返回响应数据
 */
@DeleteMapping("/getDemoResult")
public Result getDemoResult(@RequestBody String demoId)
{
    return demoService.selectListById(demoId);
}
/**
 * 返给前端响应对象
 */
@Data
@AllArgsConstructor
@NoArgsConstructor
public class Result {

    private String rootId;
    private List<Demo1> nodes;
    private List<Demo2> lines;

}
  • 1
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

cgv3

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值