[new feature] SwitchCell: add border prop

This commit is contained in:
陈嘉涵 2019-04-30 15:11:05 +08:00
parent 3af9cf6c41
commit 95925ab328
8 changed files with 36 additions and 6 deletions

View File

@ -56,6 +56,10 @@
- 新增`left-icon`插槽
- 新增`right-icon`插槽
## SwitchCell
- 新增`border`属性
### Sku
- 新增`preview-open`事件

View File

@ -93,7 +93,7 @@ exports[`create a AddressEdit with props 1`] = `
<div class="van-field__body"><input type="tel" maxlength="6" placeholder="邮政编码" value="10000" class="van-field__control"></div>
</div>
</div>
<div class="van-cell van-cell--center van-cell--borderless van-switch-cell">
<div class="van-cell van-cell--center van-switch-cell">
<div class="van-cell__title"><span>设为默认收货地址</span></div>
<div class="van-cell__value">
<div class="van-switch van-switch--on" style="font-size:24px;">

View File

@ -65,7 +65,7 @@ Vue.use(NoticeBar);
| Event | Description | Arguments |
|------|------|------|
| click | Triggered when click NoticeBar | - |
| click | Triggered when closed | - |
| close | Triggered when closed | - |
### Slot

View File

@ -55,9 +55,10 @@ use `loading` property to keep component in loading state
| Attribute | Description | Type | Default |
|------|------|------|------|
| v-model | on-off state of the switch | `any` | `false` |
| title | the leftside title | `String` | `''` |
| loading | whether switch is loading | `Boolean` | `false` |
| disabled | whether to disable switch | `Boolean` | `false` |
| title | the left side title | `String` | `''` |
| border | whether to show cell border | `Boolean` | `true` |
| loading | whether switch is loading | `Boolean` | `false` |
| disabled | whether to disable switch | `Boolean` | `false` |
| size | Size of switch | `String` | `24px` |
| active-color | Background of switch color when active | `String` | `#1989fa` |
| inactive-color | Background of switch color when inactive | `String` | `#fff` |

View File

@ -38,7 +38,10 @@ function SwitchCell(
SwitchCell.props = {
...switchProps,
title: String,
border: Boolean,
border: {
type: Boolean,
default: true
},
size: {
type: String,
default: '24px'

View File

@ -0,0 +1,11 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`border prop 1`] = `
<div class="van-cell van-cell--center van-cell--borderless van-switch-cell">
<div class="van-cell__value van-cell__value--alone">
<div class="van-switch" style="font-size: 24px;">
<div class="van-switch__node"></div>
</div>
</div>
</div>
`;

View File

@ -15,3 +15,13 @@ test('change event', () => {
expect(onChange).toHaveBeenCalledWith(true);
});
test('border prop', () => {
const wrapper = mount(SwitchCell, {
propsData: {
border: false
}
});
expect(wrapper).toMatchSnapshot();
});

View File

@ -55,6 +55,7 @@ export default {
|------|------|------|------|------|
| v-model | 开关状态 | `null` | `false` | - |
| title | 左侧标题 | `String` | `''` | - |
| border | 是否展示单元格内边框 | `Boolean` | `true` | 2.0.0 |
| loading | 是否为加载状态 | `Boolean` | `false` | - |
| disabled | 是否为禁用状态 | `Boolean` | `false` | - |
| size | 开关尺寸 | `String` | `24px` | 1.1.11 |