# yamlVisualEditor

**Repository Path**: baoge1983/yamlVisualEditor

## Basic Information

- **Project Name**: yamlVisualEditor
- **Description**: No description available
- **Primary Language**: HTML
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2025-10-31
- **Last Updated**: 2025-10-31

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

yaml可视化编辑器
===
# 背景
出于公司业务需求，需要实现一个可以供销售人员使用的编辑yaml参数的编辑器，原先是安排同事实现，他前期调研了fast-json-patch,但是实际操作和需求不符，因此需要考虑其他更符合需求的工具
# 分析
之所以不考虑使用fast-json-patch或者smarty而是自己开发工具，是基于以下几个原因：    
（1）每个店都有自己的yaml配置，但配置项千差万别（如果使用类似于smarty模板的方式来做，那么每次添加参数都要修改，且维护成本比较高）    
（2）前端有各种类型，例如bool型参数应该展示为开关样式，int型展示为radio格式,string展示为input框等等    
（3）大部分值显示的和实际的不一致，例如显示值为1，代表填入了11，会有一个映射表{0: 0, 1: 11, 2: 13}
# 使用
最终的实现效果大致如下所示：    
[效果图](!./../01.png)
# 技术实现
基于react实现,使用antd组件