官网组件以及API版本状态维护信息管理方案

本文关于官网组件以及api版本状态维护信息管理方案。

实现说明

采用 数据 和 显示控制 分离的思路。

使用说明

我们将从组件维度和API维度分别阐述下自己的生命周期

组件：

experimental（实验性的阶段）--> stable:(稳定性阶段) --> deprecated(弃用阶段) --> toBeRemoved(被移除阶段)

API:

stable:(新增就是稳定阶段) --> deprecated(弃用阶段) --> toBeRemoved(被移除阶段)

为了保证使用的方便和最小的心智负担，提供一个统一的配置方式，如下所示：

type VersionString = '3.x.x' | '2.x.x'

interface Meta {
    // API属性不具备此生命周期
    experimental?: VersionString 
    stable?: VersionString 
    deprecated?: VersionString 
    toBeRemoved?: VersionString 
  }

根据组件或者属性的特性，选择一个或者多个生命周期填写对应的版本号，下面以 button 组件为例分别展示三种使用场景。

场景一：给官网目录的组件项打标签，显示组件维护的状态（文件地址： examples/sites/demos/pc/menus.js）。

例如 3.12.0 版本我们新增了一个按钮组件，并且还处于实验阶段的生命周期，于是我们可以在官网菜单配置文件中添加如下 meta 信息：

{ 
'nameCn': '按钮', 
'name': 'Button', 
'key': 'button' 
'meta': {
    'experimental': '3.12.0'
  }
}

场景二：给组件示例页面顶部公告栏显示版本信息（文件地址： examples/sites/demos/pc/app/button/webdoc/button.js）。

如果配置了如下的 meta 信息，那么在官网 button 组件的示例顶部会有对应的提示效果。

export default {
  column: '2',
  owner: '',
  meta: {
    experimental: '3.12.0'
  },
  demos: []
}

场景三：给组件API（props、events、slots）显示版本信息（文件地址： examples/sites/demos/api/button.js）。

例如在 3.12.0 版本给 button 组件添加了 disabled 属性，那么可以进行如下配置：

 {
   name: 'disabled',
   type: 'boolean',
   defaultValue: 'false',
   meta: {
       stable: '3.12.0'
   }
}

然后就可以在组件的API表格中看到提示效果。