Releases: ZhongAnTech/zarm
Releases · ZhongAnTech/zarm
v2.0.0-alpha.57
Bug Fixes
- 修复v2.0.0-alpha.56中picker-view组件滑动问题。
- 修复v2.0.0-alpha.56中select组件第一次弹出后直接点击蒙层关闭，会导致输入框空白的问题
- 修复Checkbox组件在选中状态并且disable为true时的样式问题。
v2.0.0-alpha.56
Features
-
Popup组件以及基于Popup完成的Modal、Picker、Select、DatePicker、DateSelect、Alert、Confirm、Toast、Loading等组件均增加了以下属性：
getContainer —— 用于自定义挂载节点（在alpha.52版本之前是默认挂载到body下）
disableBodyScroll —— 弹层展示后是否禁止body滚动（在alpha.56版本之前无法禁止）
destroy —— 弹层关闭后是否移除节点（在alpha.56版本之前是默认移除） -
Modal组件新增closable属性用于控制右上角是否展示关闭按钮。
-
Modal组件新增onCancel属性，如果maskClosable或closable为true，那么点击遮罩或者右上角关闭按钮会调用此函数
BREAKING CHANGES
- Modal、Picker、Select、DatePicker、DateSelect、Alert、Confirm 组件移除了onMaskClick方法，增加maskClosable属性来控制点击遮罩关闭。
- Modal组件不再采取Modal.Header、Modal.Body、Modal.Footer的形式来传递内容，而是相应采用title、children（
<Modal>{children}</Modal>）、footer属性来传递。 - Alert、Confirm的静态调用不再采取
Alert.show()以及Confirm.show()的方法，会替换成Modal.alert({...alertConfig})以及Modal.confirm({...confirmConfig})，具体用法请参考demo
v2.0.0-alpha.55
build: build 2.0.0-alpha.55
v2.0.0-alpha.49
v2.0.0-alpha.31
Feature
- 支持使用css格式的样式文件（借助 babel-plugin-import）。
.babelrc 配置如下：
plugins: [
['import', { libraryName: 'zarm', style: 'css' }, 'zarm'],
]Bug Fix
- 修复移动端
Keyboard组件 delete 会触发多次的情况。 - 修复部分ts类型定义问题
启用css variables替代sass做为组件的样式配置
重要更新
- v2.0.0-alpha.30版本开始使用css variables替代sass变量做为组件的样式配置。
修改变量的方式：
document.documentElement.style.setProperty('--theme-primary', '#00bc70');或者
:root {
--theme-primary: #00bc70;
}降级方案
由于css variables部分机型有兼容性问题（参考caniuse），可以用 css-vars-ponyfill 实现一个降级方案。
import cssVars from 'css-vars-ponyfill';
cssVars({
// Options ...
});v2.0.0-alpha.22
BREAKING CHANGES
-
在v2.0.0-alpha.16版本之前，需要在项目的package.json - dependencies中增加"better-scroll": "1.12.6"，防止因为依赖的better-scroll版本更新导致组件出现无法滚动的问题。
-
从v2.0.0-alpha.16版本开始，组件库的样式采取了BEM命名方法，之前有覆写过组件样式的地方要注意修改。
-
从v2.0.0-alpha.14版本开始，组件库增加了国际化，并且默认为英语。
由于国际化默认为英语，所以需要在入口文件的顶层组件上包装一层国际化组件，重置为中文。
import { LocaleProvider } from 'zarm';
import zh_CN from 'zarm/lib/locale-provider/locale/zh_CN.js';
...
const rootElement = document.getElementById('app');
render(
<LocaleProvider locale={zh_CN}>
<Provider store={store}>
<Router routes={routes} history={history} />
</Provider>
</LocaleProvider>,
rootElement
);