1.前端页面开发：
（1）在模板中加入对话框：
//新增菜单的对话框
<el-dialog
title="提示"
:visible.sync="dialogVisible"
width="30%">
<span>这是一段信息</span>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取 消</el-button>
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>其中 :visible.sync="dialogVisible" 值为false时不显示对话框，所以可以绑定此属性来决定何时打开对话框：
在data中默认给值：
dialogVisible: false,
在dialog中添加表单：表单双向绑定了category
<el-form :model="category">
<el-form-item label="分类名称" :label-width="formLabelWidth">
<el-input v-model="category.name" autocomplete="off"></el-input>
</el-form-item>
</el-form>在data中绑定category:
category: {name:"",parentCid:0,catLevel:0,showStatus:1,sort:0},(2)为dialog中的确定按钮绑定事件：
<el-button type="primary" @click="addCategory">确 定</el-button>并在方法中加入此方法：
//添加三级分类
addCategory(){
console.log("提交的三级分类为",this.category)
},在打开对话框的时候需要给要添加的菜单赋值：
//打开对话框
append(data) {
this.dialogVisible = true;
this.category.parentCid = data.catId;
this.category.catLevel = data.catLevel*1 + 1;
console.log(data);
},（3）发送请求：
因为前端发送的数据跟CategoryEntity对象的属性名都相同，所以可以直接接收，不要要封装DTO
/**
* 保存
*/
@RequestMapping("/save")
public R save(@RequestBody CategoryEntity category){
categoryService.save(category);
return R.ok();
}前端发送请求：
//添加三级分类
addCategory(){
console.log("提交的三级分类为",this.category);
this.$http({
url: this.$http.adornUrl('/product/category/save'),
method: 'post',
data: this.$http.adornData(this.category, false)
}).then(({data}) => {
this.$message({
message: '菜单保存成功',
type: 'success'
});
//关闭对话框
this.dialogVisible = false;
this.getMenus();
//设置需要默认展开的菜单
this.expendedKey = [this.category.parentCid]
});
},这里会有一个bug:
return categoryEntity.getParentCid() == root.getCatId();新建层级不能显示是因为递归filter过滤的时候catId和父id是Long对象，所以==不行要用equils
两个Long对象值超过127的时候就不能用== 号来进行比较了，必须使用equals。
在后台debug可以看到catId的类型：
