Vueはオブジェクトデータを転送し、バックグラウンドで解析して使用します.

1.まずvueに対応するエンティティ操作コード

2.vue代码对应的数据初始化和对应的updateTab方法

//     
 Tab: {
        tabName: "",
        parentId: "",
        tabDescribe: ""
      },


//         
    updateTab() {
      this.FormVisible = false;
      let data = qs.stringify({
        tab : JSON.stringify(this.Tab)
      });
       //  tab             JSON   
        //   :tab: {"tabName":"  ","parentId":0,"tabDescribe":"11"}
      axios
        .post(url.updateTabById + this.selectedId, data)
        .then(res => {
            if (res.data == "    ") {
              this.$message({
                type: "success",
                message: "    "
              });
              this.getInfo();
            }
            if (res.data == "    ") {
              this.$message({
                type: "error",
                message: "    "
              });
            }         
        })
        .catch(err => {
          console.log(err);
        });
    },

3.対応するバックグラウンドコード(ここではSpringBootを使用しています)

 //root      id      
    @RequestMapping(value = "/updateTabByIdRoot/{Tid}")
    @ResponseBody
    public String updateTabByIdRoot(@PathVariable("Tid") int Tid, HttpServletRequest request){
        Tab tab = JSON.parseObject(request.getParameter("tab"),Tab.class);
        System.out.println(tab.toString());
        tab.setId(Tid);
        //        
       int result =  tabService.updateTab(tab);
       if(result<0){
           return "    ";
       }else{
           return  "    ";
       }
    }