链氪巴士
  1. 首页
  2. 站点导航
  3. 文章
  4. 快讯
  5. 软件
  6. 书刊
  7. 关于

Tencent/WeComponents:基于CLS的Vue.js声明式组件库

WeComponents是一个基于通用组件语言规范(CLS)实现的Vue.js声明式组件库。其特点是写完JSON就可做好页面,开发更简单。设计思想以CLS为核心,数据驱动UI,对开发者友好,低门槛、易理解、易记忆、易使用且语义化,目前主要包含表单、列表、图表三类组件的实现,还给...

访问官网 →

【Github】项目名:Tencent/WeComponents:基于CLS的Vue.js声明式组件库

项目简介

WeComponents是一个基于通用组件语言规范(CLS)实现的Vue.js声明式组件库。其特点是写完JSON就可做好页面,让开发更简单。在设计思想上以实现CLS(将所有组件抽象为统一模型)为核心,采用数据驱动UI的方式,数据以数据结构描述组件,组件描述页面。该组件库对开发者友好,具有低门槛、易理解、易记忆、易使用和语义化的特点,目前主要包含表单、列表、图表三类组件的实现,更多内容可查看说明文档。

使用说明(以Vue.js为例)

  1. 引入组件库:import WeComponents from ‘@weadmin/wecomponents’;

  2. 声明页面组件:let pageFields =[{component: ‘input’, label: ‘标题’}];

  3. 数据绑定:export default {data() {return { //初始化组件库 page: new WeComponents(this, pageFields)}}};

案例展示

以一个常见的查询列表需求为例(完整代码见demo工程)。需求背景为提供一个搜索框,点击查询按钮后,展示结果列表且需要支持翻页。组件声明等相关内容已给出示例。

项目总结

WeComponents是一个很有潜力的Vue.js组件库。如果你有好的意见或建议,欢迎给我们提Issues或PullRequests。同时腾讯开源激励计划鼓励开发者的参与和贡献,期待你的加入。也希望大家在评论区留言,一起讨论这个组件库相关的话题。

项目地址

GitHub链接直达