ant-mini-program / mini-antui Goto Github PK

View Code? Open in Web Editor NEW

454.0 30.0 91.0 727 KB

mini-antui 停止维护，可使用 mini-ali-ui ，品牌升级，功能加强，欢迎使用！

Home Page: https://github.com/Alibaba-mp/mini-ali-ui

License: MIT License

JavaScript 3.99% TypeScript 44.66% Less 51.35%

mini-program antui

mini-antui's Introduction

重要说明

mini-antui 将不再更新、维护。后续请使用 ant-design-mini

Mini AntUI

基于 Alipay Design 设计规范；
支持多端小程序（支付宝，淘宝，钉钉等）；
支持主题配置切换；
支持 px 与 rpx；

示例

链接

特性

基于Advance Design设计规范
使用支付宝小程序开发

安装

$ npm install mini-antui --save

使用

在页面json中文件中进行注册，如card组件的注册如下所示：

{
  "usingComponents": {
    "card": "mini-antui/es/card/index",
  }
}

在axml文件中进行调用：

<card
  thumb="{{thumb}}"
  title="卡片标题2"
  subTitle="副标题非必填2"
  onClick="onCardClick"
  info="点击了第二个card"
/>

详细使用说明请参照官方文档使用自定义组件

贡献

如果你有好的意见或建议，欢迎给我们提issue。

mini-antui's People

Contributors

Stargazers

Watchers

Forkers

786320861 befairyliu yautah mlshuguang shiiiiiiji michealx stonelee alonprince 0326 xinnian88 chenyukunjoshhub sinfuture yulongcs johnson27 utsource drlin eternalsky samwang2017 zxlzhang arvinzzq wzz1020 jixianga sheweichun andygoo xieyanmei kangaoxiaoshi rockyou9000 jincdream wnlee kule2018 raohuangxing flyingflowers dwej mtcle halu886 hansjiang ariel-zhangyue fegg baixiaodu songbaobaoking bossding shoron tangxunye openwayne cgkoreyoshi sudoooooo wangqiang66 1206646568 ft3590782 pxyl789 chaunceylin weitongxue huchun666 chenfushan lixuejiang 190389518 wbsabc yejiagh laden666666 noneven chengfeiblog defolly linxz oimz1989 sunshine5746 tongxin3267 jacob-zch guyulei jacksonhan johnsstt tomzio kdwangboss thunf ruanxiaoquan taosin kevincui612 noshower ryanliu0235 luozhen2580 chenrunmiao bevexed fourleaf-clover ich1990 guanking wbye hubinadd quantum-35 qichuan youshao armymedalmei josmun55

mini-antui's Issues

[AMIcon]组件样式默认则会有undefined样式

问题描述：

mini-antui/components/am-icon/index.axml

Line 2 in 15a0945

class="am-icon {{className}} am-icon-{{type}}"

处有个代码 {{className}}如果使用者不传入class则默认为undefined 请加上 {{className||''}}避免而外样式谢谢？

结果：默认不传值出现undefined
期望：默认不传值默认为空

Input-item 组件 onBlur 事件对象中，dataset 为空

Describe the bug
Input-item 组件 onBlur 事件对象中 dataset 为空，导致无法带出自定义数据

To Reproduce

模板中加入自定义属性

<input-item onBlur="handleBlur" data-field="abc"></input-item>

事件处理函数

handleBlur (e) {
    console.log(e);  // dataset 为空
}

Expected behavior
事件对象中存在有效的 dataset

flex组件没有 justify-content:center

swipe-action在点完rightBtn之后不自动合上

Is your feature request related to a problem? Please describe.
swipe-action在左滑点删除按钮的时候需要二次确认，现在点完一次之后就自动合上了

Describe the solution you'd like
添加类似done回调的方法，当调用done回调的时候，才去合上

onRightItemClick(index, detail, extra, done) {
    setTimeout(() => {done()}, 1000);
}

v-tabs组件真机左侧tab不能跟随右侧滚动变化

v-tabs组件真机左侧tab不能跟随右侧滚动变化
模拟器正常, 真机会出现左侧tab无法点击, 无法跟随右侧tab滚动的情况

截图

Smartphone:

Device: 华为p20
OS: android 8.1
容器 Nebula

子组件能通知父组件自己的变化，即子组件能调用父组件中方法

Is your feature request related to a problem? Please describe.
A clear and concise description of what the problem is. Ex. I'm always frustrated when [...]

Describe the solution you'd like
A clear and concise description of what you want to happen.

Describe alternatives you've considered
A clear and concise description of any alternative solutions or features you've considered.

Additional context
Add any other context or screenshots about the feature request here.

[Feature] List 组件增加下拉 loading 功能

目前 List 组件比较简单，很多无限滚动的列表下拉到底部一定距离时，需要异步加载数据，并且展示 loading 状态，或者像 antd 一样，提供 loadMore 功能。

picker-item无onSelect

https://docs.alipay.com/mini/component-ext/inputitem

如图所示，使用onSelect报错，应该为onPickerTap

不要用版本号判断

mini-antui/src/swipe-action/index.js

Line 2 in 4f1d39d

const isV2 = +(my.SDKVersion.split('.').join('')) > 1112;

使用 canIUse

Tab组件中，提供控制当前选中tab页的能力

Is your feature request related to a problem? Please describe.
有时候需要从某个页面跳转到一个包含tabs的页面，且跳转过去之后，选中除第一个以外的tab

Describe the solution you'd like
通过传入一个属性和一个方法来实现双向绑定来控制选中项

vtabs新增右侧滑动到对应分类时，可以暴露出一个监听的事件，或者回调函数，方便引用它的组件可以监听的到。

tab组件，处于active的tabBar添加一个class

由于视觉给出的视觉稿常常与组件有出入，所以需要通过css覆盖来完成。但是当前tab组件处于active的tabBar并没有一个class类，所以无法通过样式覆盖来更改样式。是否可以为active的tabBar加一个class类名，便于业务开发呢？

Do you want to request a feature or report a bug?
bug
What is the current behavior?
语法错误
If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. Your bug will get fixed much faster if we can run your code.
直接报错
What is the expected behavior?
index.axml 第 40 行 scroll-y={{true}} 漏掉了 }
Which versions of mini-antui, and which version of Alipay are affected by this issue? Did this work in previous versions of mini-antui?
master

tabs 左右滑动时需要增加事件

https://docs.alipay.com/mini/component-ext/tabs

tab下content是根据点击的tab动态加载的，此时如果使用swipeable 左右滑动并不会出发onTabClick ，导致左右滑动时无法加载新tab下的数据，tab样式不会定位到新的tab下。

请问一下有人用mpvue开发支付宝小程序时使用这个吗

使用Mpvue开发支付宝小程序时使用这个UI页面不会展示任何样式。

tab标签切换的时候，内容部分样式有问题

Describe the bug
切换tab的时候，是通过translateX(-100%)来改变当前显示内容的，am-tabs-slides没有给width: 100%，所以am-tabs-slides是所有自己宽度的和，-100%就到空白部分了

Additional context
我改了下，但是不太熟github的协同工作流，所以这个提交和swipe-action的修改自动合并到一个pull request里面了

tabs组件tab-content 默认是屏幕的宽度

stepper步进器

stepper步进器达到最大值（最小）后加号会隐藏，此时setData当前值为1，加号不会自动显示，点击后可以显示。

swipeAction 说明文档建议

https://docs.alipay.com/mini/component-ext/swipe-action

建议restore改为restore="{{swipeIndex == null || swipeIndex !== index}}"

这样编辑和删除完之后直接this.setData({'swipeIndex': null})即可恢复到初始状态

[AMIcon]组件不支持onTap事件么？

描述：在使用AMicon图标时候我注册了onTap事件，但是点击没有触发，难道小程序的text标签不能注册事件么？
<am-icon type="delete" size="{{24}}" color="#333" data-index="{{1}}" onTap="delOption"></am-icon>
delOption(e){ debugger const index = e.target.dataset.index; this.$spliceData({'items':[index,1]}); },
当前行为：注册事件不触发
期望行为：注册onTap事件能触发方法

miniui版本："version": "0.4.22"

华为P20 显示有问题

华为P20，系统：EMUI版本8.1.0， Android版本8.1.0, 支付宝版本：10.1.5，组件无法显示，

支付宝小程序打开小程序官方示例，显示不正常，扩展组件打开白屏

calendar是否能增加禁用某段时间的功能

安装mini-antui后，无法读取webpack.config.babel.js配置文件

Cannot read property 'replace' of undefined
at /Users/.../node_modules/webpack/lib/NormalModuleFactory.js:106:27
at /Users/.../node_modules/webpack/lib/NormalModuleFactory.js:59:4
at applyPluginsAsyncWaterfall (/Users/.../node_modules/webpack/lib/NormalModuleFactory.js:236:4)