後臺list怎麼傳前臺
阿新 • • 發佈:2018-12-04
前後臺數據互動的時候還是使用String吧。
先描述下我的整個前後臺數據互動的過程:
1.前臺傳送請求獲取一個商品列表
2.後臺傳送一個列表給前臺
3.前臺接收後,取出該列表的子列表,再傳送給後臺
4.後臺接收到該列表後,進行處理
整個資料互動的過程已經描述完畢。
我的處理方案是:
1.後臺接收帶請求後,將該list轉換成JSONArray物件,然後將其再轉換成為String型別的資料傳送給前臺。
2.前臺收到該資料後,直接放入其對應的變數中。取出需要的子列表後,用js將其轉換稱為json的String型別
3.後臺用String型別接收後,再將其轉換為JSONArray,再繼續將JSONArray轉換稱List型別的,後臺再繼續處理它需要的邏輯。
貼上會讓人覺得很懵的程式碼:(listGoodsByQ方法返回的是JSONArray型別)
1.前臺傳送請求獲取一個商品列表
search: function () { console.log("搜尋商品"); axios.get('../../WeChatMaterial/search?q=' + app.query) .then(function (response) { // console.log(response.data); app.searchList = response.data; }) },
2. 後臺傳送一個列表給前臺
//獲取商品列表 @GetMapping("search") @ResponseBody public void searchByQ(HttpServletResponse response, String q) { try { response.setCharacterEncoding("utf-8"); PrintWriter writer = response.getWriter(); log.info(youzanAPIManager.listGoodsByQ(q)); writer.print(youzanAPIManager.listGoodsByQ(q).toString()); writer.flush(); writer.close(); } catch (IOException e) { log.error(ExceptionUtils.getTraceInfo(e)); } }
3.前臺接收後,取出該列表的子列表,再傳送給後臺(前臺的變數)
query:"",
goods:[],//傳到後臺
goodsList:[],
searchList:[]
(在獲取傳回的searchList時,檢視控制檯它的格式是[recommendation(id=111 name=商品1).....]大概就是這樣的,因為時間久了,突然想來才寫的部落格 )
這個程式碼就是提交了個表單 (goodsList是’原生‘的子列表 在提交表單的時候,檢視控制檯可以看到她的格式[Object object])
app.goods = JSON.stringify(app.goodsList);
4.後臺接收子列表
//新增文章
@PostMapping("insert")
@ResponseBody
public Object insertWeChatMaterial(HttpServletRequest request, RecommendationItem recommendationItem, GoodsArticle goodsArticle, String goods) {
try {
UserInfo userInfo = (UserInfo) request.getAttribute("userInfo");
log.info("goodsList--" + goods);
JSONArray array = JSONArray.fromObject(goods);
List<RecommendationGoods> goodsList = (List<RecommendationGoods>) JSONArray.toCollection(array, RecommendationGoods.class);
recommendationItem.setName(goodsArticle.getTitle());
Boolean flag = recommendationItemService.saveMaterial(recommendationItem, goodsArticle, goodsList);
if (flag) {
return ResponseObject.successWith(userInfo.getDisplayName(), null);
} else {
return ResponseObject.failWith(500, "資料新增失敗!");
}
} catch (Exception e) {
log.error(ExceptionUtils.getTraceInfo(e));
return ResponseObject.failWith(500, e.getStackTrace().toString());
}
}