@xieqiqiang00 JSON 正反序列化器最重要的意义是保证类型安全，然后在此基础上加一些工程特性，比如 JSON 字段与 Model 字段名称映射，规则校验等

但对于切图仔来讲有点尴尬的是，JS 如果要做类型安全，那么 API 设计的就比较丑陋，一般需要声明一个 Schema，然后人工维护字段关系，这样就比较繁琐，而且代码不是那么随意抽插；如果要学习类似 JSON.NET 的声明式注解，虽然 API 会好看很多，感觉有点像 AOP，但项目一定要上 TypeScript 并且打开 emitDecoratorMetadata，因为要用到反射，但某些时候项目已经不能支持，或者类似 Vite 这样 ESBuild 的工具链，如果为了这一个特性就大动干戈就比较难受.

我觉得切图仔对 JSON 正反序列化器也是有需求的，我自己仿造 JSON.NET 的 API 做了一个序列化器，然后在公司项目中大规模使用了，公开的版本在这里 https://github.com/vuevert/Vert-Serializer，不过是需要 TS + 装饰器 + emitDecoratorMetadata 环境的.

这个我在项目里一般和数据访问层结合，然后 API 大概可能长这样:

```ts
@Serializable()
class User {
@JsonProperty()
name: string = ''

@JsonProperty('user_age') // 数据源字段名称可以和 Model 不一样，比如接口里为 user_age.
age: number = 0 // 如果接口返回的不是 number 则取 0 作为默认值.
}

function getUserData (id: string) {
return HttpService.get({
url: '/user',
data: {
id
},
type: User
})
}

getUserData('1') // Promise<User>
```

这样就可以直接把 JSON 变为 Model.

另外我个人喜欢在项目中将各个功能集成在 Model 上以便查找，避免分散代码：

```ts
@Serializable()
class User {
@JsonProperty()
@IsString(1, 20, '请填写用户名，长度在 1- 20')
name: string = ''

@JsonProperty('user_age')
@IsInt(0, 120, '请填写正确的年龄.')
age: number = 0 // 如果接口返回的不是 number 则取 0 作为默认值.
}
```

然后直接在视图中使用：

```tsx
const userValidator = getValidator(User)

<Textfield rules={userValidator.name} />
<Textfield rules={userValidator.age} />
```

这样视图中就不需要再额外写验证器逻辑了.

其实这些设计非常传统.