过年时鼓捣xirang框架遇到的前后端问题两则

过年在家时，借鉴 gin-vue-admin 项目的多模块儿思路，抽空把 xirang (opens new window) 项目做了一波大改造，使之更加底层，也更易于扩展。在这个折腾的过程中，前后端都遇到了一个问题，在此记录。

# 后端-go-playground/validator 校验的零值问题

与其他 go-web 项目类似，我的这个框架中前端的菜单也是由后端管理的动态路由，这个路由是一个树的概念，每个层级通过 ParentId 字段串联，在请求参数中，这个字段的配置如下：

	ParentId uint `json:"parentId" validate:"required"`

之前针对菜单的增删改查一直没遇到什么问题，这次因为模块儿调整，涉及到一级目录的调整，发现更新一级目录的时候，总是会报一个错误：ParentId为必填字段，然而打开请求参数，却又发现，这个字段明明已经正常传递了值的：

经过网上一番检索，发现问题出在了 validate:"required"，当你这么配置的时候，意味着该字段为必填，且不能为零值，而针对 uint 类型而言，0 则是不符合条件的，因此会出现这个错误。

这里可以调整为如下配置：

	ParentId uint `json:"parentId" validate:"gte=0"`

表示校验对应值大于等于 0 即可。

# 前端-多层路由面包屑重复渲染的问题

当我把项目重新设计为多模块儿之后，原本只有两级的菜单，会变成三级，因为自己对前端的一知半解，出现字段配置错误，从而搞出了一个卡了我半个月的问题来。

原本菜单中的日志管理是二级目录，现在统一划归到系统管理下，就自动变为三级目录，而在创建二级目录日志管理时，我想当然的以为目录的 component 应该跟一级目录一样，配置为 Layout，于是我就这么配了，配置之后发现，点击页面之后，出现的效果如下：

跳入这个坑之后，我就进入到了一个貌似没人踩过的坑里，检索了大量的网页，也没有寻到与我相同的问题。真正前端行内的人，也许不会犯我这种门外汉想当然而造成的错误。

不过出现问题也不见得是坏事，问题没有解决的这些日子里，我无法安稳入睡，无法将其他项目往前推进，始终念念不完，反而催促自己，阅读了解项目的源码架构，以及在 vue-element-admin 项目的 issue 区、官方文档中反复浏览。

但是最终仍旧没能将原因找到，更莫提问题的解决，我甚至已经开始了解新的框架 pure-admin 了。

后来还是在专业前端人士的指导下，发现了问题的根源，我的 日志管理 的配置的问题，我的配置信息如下：

{
	Model:     gorm.Model{ID: 7},
	Name:      "Log",
	Title:     "日志管理",
	Icon:      "log",
	Path:      "log",
	Component: "Layout",
	Redirect:  "/system/log/operationLog",
	Sort:      7,
	ParentId:  uint1,
	Roles:     roles[:2],
	Creator:   "系统",
}

问题原因：日志管理是二级菜单，而我配置的 component 为 Layout，目前还不是很了解这个 Layout 的意义代表什么，只不过将其改为如下信息：

{
	Model:     gorm.Model{ID: 7},
	Name:      "Log",
	Title:     "日志管理",
	Icon:      "log",
	Path:      "log",
	Component: "/system/log/index",
	Redirect:  "/system/log/operationLog",
	Sort:      7,
	ParentId:  uint1,
	Roles:     roles[:2],
	Creator:   "系统",
}

然后在 src/system/log 下创建 index.vue 文件，写入如下内容：

<!-- 如果路由有多个层级，那么此处需要如下代码，详见：https://panjiachen.github.io/vue-element-admin-site/zh/guide/essentials/router-and-nav.html#%E5%A4%9A%E7%BA%A7%E7%9B%AE%E5%BD%95-%E5%B5%8C%E5%A5%97%E8%B7%AF%E7%94%B1 -->
<template>
  <router-view />
</template>

此时再次点击操作日志的页面，就不会再出现顶部重复渲染的问题了。