Dingtalk-design-miniapp NPM

dingtalk-design-miniapp

介绍

DingUI小程序组件（dingtalk-design-miniapp）是一套遵循钉钉设计规范的组件库，涵盖基础组件和业务组件，由钉钉官方为钉钉小程序量身设计，让用户的体验和感知统一。

钉钉扫码体验地址：

安装

npm i dingtalk-design-miniapp

使用

API和Document

dingtalk-design-miniapp组件库提供了本地化demo&doc工具给开发者

使用dingtalk-design-miniapp

dingtalk-design-miniapp的使用方式与自定义组件的使用方式相同，这里以button为例，简要描述如何使用dingtalk-design-miniapp组件库:

1.引入dingtalk-design-miniapp组件

安装dingtalk-design-miniapp组件库后，在我们将要使用组件的页面json文件中引入dingtalk-design-miniapp组件，例如：

在页面 page.json中写入代码：

  {
    "component": true,
    "usingComponents": {
      "button": "dingtalk-design-miniapp/es/button/index"
    }
  }

2.使用dingtalk-design-miniapp组件

此时，在页面axml中可以通过<button>元素使用dingtalk-design-miniapp组件啦，

通过查看文档了解到button的属性后配置如下：

  <button type="primary" onCatchTap="onTap" className="button-default">主要操作</button>

3.dingtalk-design-miniapp组件的事件开发

上文中我们使用了onCatchTap事件，此事件指向了onTap方法，故需要我们在页面js文件中，开发该方法,即可

Page({
  onTap(e){
    console.log(e)
  }
})

1.不可以改变组件内部环境

在页面中使用，切忌不可尝试改变组件内部data或者方法等

效果

效果图

CHANGELOG

1.3.9
- spin 支持分页加载样式
- 产生专门的 px npm包，此包所有单位为rpx
1.3.5
- 新增 drawer 组件
- 优化字体适配，单位从rpx换成px
1.0.0-beta.16
- list-item 支持绑定 data- 属性，onTap 会返回

dingtalk dingui dingui-mini dingtalk-design-miniapp dingtalk-design miniprogram

fast-deep-equal

@infinitebrahmanuniverse/nolb-din @everything-registry/sub-chunk-1481

1.9.7

12 months ago

1.9.5-beta.1681125059742

1 year ago

1.9.5-beta.1681118448056

1 year ago

1.9.6-beta.1681125655406

1 year ago

1.9.5-beta.1681125056347

1 year ago

1.9.6

1 year ago

1.9.6-beta.1681125659254

1 year ago

1.9.5-beta.1678254083635

1 year ago

1.9.5-beta.1678256619417

1 year ago

1.9.5

1 year ago

1.9.5-beta.1678350958622

1 year ago

1.9.5-beta.1678256132054

1 year ago

1.9.5-beta.1678257148108

1 year ago

1 year ago

1 year ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

1 year ago

2 years ago

2 years ago

1 year ago

2 years ago

2 years ago

2 years ago

1 year ago

1 year ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

2 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago

3 years ago