項(xiàng)目地址

安裝

yarn add iwe7-design

使用

import {Iwe7DesignModule} from 'iwe7-design';

imports: [
    ...
    Iwe7DesignModule.forRoot([])
]

<div class="container">
    <design-layout></design-layout>
</div>

開(kāi)發(fā)自己組件

import {
  ElementRef
} from "@angular/core";
import { Iwe7DesignComponent, Iwe7DesignSettingComponent } from 'iwe7-design';

@Component({
  selector: "my-comp",
  template: `預(yù)覽我的第一個(gè)組件`,
  styles: [``]
})
export class MyComp extends Iwe7DesignComponent{
    constructor(ele: ElementRef){
        super(ele)
    }
}
@Component({
  selector: "my-comp",
  template: `設(shè)置我的第一個(gè)組件`,
  styles: [``]
})
export class MyCompSetting Extends Iwe7DesignSettingComponent{
    constructor(ele: ElementRef){
        super(ele)
    }
}

添加到組件庫(kù)

let design: Iwe7DesignConfig = {
  "my-comp": {
    title: "我的組件",
    name: "my-comp",
    show: true,
    setting: MyCompSetting,
    preview: MyComp,
    props: {
      name: "my-comp",
      style: {},
      class: {}
    }
  }
};

imports: [
    ...
    Iwe7DesignModule.forRoot([design])
]

總結(jié)

大NG實(shí)在強(qiáng)大, 一起來(lái)完善這個(gè)組件庫(kù)吧！我最近會(huì)把微信小程序的一些組件加進(jìn)來(lái)，歡迎關(guān)注！