tangram-page1
v0.6.3
Published
A Vue.js project
Downloads
2
Readme
tangram 组件品转平台
A Vue.js project
组件市场
平台提供给工程师和产品经理使用,直观的发现现有的组件,支持一键安装。
容器组件
- 支持灵活的布局方式
- 给组件提供数据支持
视图组件
- iView组件和业务组件
视图组件的描述文件
拼装平台的接口描述,组件名称,如何使用和事件描述等。
// 组件描述文件 0.3.0
import {Select, Option, OptionGroup} from 'iview/src/components/select';
export default {
components: {
OptionGroup,
vSelect: Select,
vOption: Option,
},
// input 定义传入的数据、模版
template: `
<vSelect v-model="select.model1" @on-change="broadcast" style="width:200px">
<vOption v-for="item in select.cityList" :value="item.value" :key="item.value">{{ item.label }}</vOption>
</vSelect>
`,
// output 事件描述
events: [
// target: 插槽名称, name: 事件名称, data: 组件数据
{ target: 'select', name: 'on-change', data: {} },
{ target: 'select', name: 'on-select', data: {} },
// ...
],
};
拼装平台
本质上是页面的框架,包含组件的插槽和消息总线,权限验证,最终拼装成单个页面组件,偏于集成到不同的项目中。