edit-ui

在线演示

编辑表单

下面的一切都是活的。schema、值与注入的函数（上传 / 搜索 / 解析）全部是本地 fixture，这个页面从不请求网络。

完整配置

包里全部控件，按分组排布，两种布局都可切换。最后一个字段带的是包不认识的 control——它降级成了只读展示，而不是抛错。

基础

标题
通关时长（分钟）
简介

支持多行；diff 以整段文本比较

发行状态
成人向
发售日
别名
寒蝉鸣泣之时Higurashi
标签 ID
71233

媒体

封面
画廊
封面

拖动图片左上角的按钮可调整顺序

这些截图来自上游源，编辑器只能调序与置顶

shot-ashot-bshot-c
固定链接无编辑权限

higurashi-no-naku-koro-ni

关系

外部链接
参与人物
#1#3
角色关系
#1
#2

前向兼容

全息强度

未知 control：包应降级为只读展示

{"level":3,"curve":"ease-out"}

发售地区

config 没写 options：选项由 schema 声明的词表推导，标签是词表发布的英文名

update:patch —— 只包含与服务端值深比较后确实不同的字段。在上面随便改点什么，它就会出现在这里。

{}

最小配置

同一个组件，三个字段，不分组。这就是最小可用的接入形态。

标题
简介
别名
寒蝉鸣泣之时Higurashi

已改动 0 个字段

script
import type { EditFieldConfigMap } from '@nextmoe/edit-ui-vue'

// fields 与 values 来自你的接口。config 是只有站点才知道的展示层：
// 标签、控件、占位符。
const config: EditFieldConfigMap = {
  title: { label: '标题', control: 'input' },
  intro: { label: '简介', control: 'textarea' },
  aliases: { label: '别名', control: 'string-list' }
}
template
<EditSchemaForm
  :fields="fields"
  :values="values"
  :config="config"
  @update:patch="(value) => (patch = value)"
/>

所有字段标签都来自站点，不来自包

你在上面看到的每一个标签、分组名与选项文案，都出自这个站点自己的 config。包内部只有极少量固定文案（「已修改」「撤销」等），目前是简体中文。