blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-24 10:20:19 +08:00
Code Issues Projects Releases Wiki Activity

[breaking change] AddressEdit: use camelcase data (#1644)

Browse Source
This commit is contained in:
neverland 2018-08-17 15:57:13 +08:00 committed by GitHub
parent abd4819ca1
commit 05c4804958
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
4 changed files with 61 additions and 61 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
packages/address-edit/en-US.md
View File

@ -103,10 +103,10 @@ export default {
| province | Province | `String` | | province | Province | `String` |
| city | City | `String` | | city | City | `String` |
| county | County | `String` | | county | County | `String` |
| address_detail | Detailed Address | `String` | | addressDetail | Detailed Address | `String` |
| area_code | Area code | `String` | | areaCode | Area code | `String` |
| postal_code | Postal code | `String` | | postalCode | Postal code | `String` |
| is_default | Is default address | `Boolean` | | isDefault | Is default address | `Boolean` |
#### searchResult Data Structure #### searchResult Data Structure
| key | Description | Type | | key | Description | Type |

54
packages/address-edit/index.vue
View File

@ -26,11 +26,11 @@
/> />
<address-edit-detail <address-edit-detail
:focused="detailFocused" :focused="detailFocused"
:value="data.address_detail" :value="data.addressDetail"
:error="errorInfo.address_detail" :error="errorInfo.addressDetail"
:search-result="searchResult" :search-result="searchResult"
:show-search-result="showSearchResult" :show-search-result="showSearchResult"
@focus="onFocus('address_detail')" @focus="onFocus('addressDetail')"
@blur="detailFocused = false" @blur="detailFocused = false"
@input="onChangeDetail" @input="onChangeDetail"
@select-search="$emit('select-search', $event)" @select-search="$emit('select-search', $event)"
@ -38,20 +38,20 @@
<field <field
v-if="showPostal" v-if="showPostal"
v-show="!hideBottomFields" v-show="!hideBottomFields"
v-model="data.postal_code" v-model="data.postalCode"
type="tel" type="tel"
maxlength="6" maxlength="6"
class="van-hairline--top" class="van-hairline--top"
:label="$t('postal')" :label="$t('postal')"
:placeholder="$t('postal')" :placeholder="$t('postal')"
:error="errorInfo.postal_code" :error="errorInfo.postalCode"
@focus="onFocus('postal_code')" @focus="onFocus('postalCode')"
/> />
<slot /> <slot />
<switch-cell <switch-cell
v-if="showSetDefault" v-if="showSetDefault"
v-show="!hideBottomFields" v-show="!hideBottomFields"
v-model="data.is_default" v-model="data.isDefault"
:title="$t('defaultAddress')" :title="$t('defaultAddress')"
/> />
</cell-group> </cell-group>
@ -69,7 +69,7 @@
<van-area <van-area
ref="area" ref="area"
:loading="!areaListLoaded" :loading="!areaListLoaded"
:value="data.area_code" :value="data.areaCode"
:area-list="areaList" :area-list="areaList"
@confirm="onAreaConfirm" @confirm="onAreaConfirm"
@cancel="showArea = false" @cancel="showArea = false"
@ -98,10 +98,10 @@ const defaultData = {
province: '', province: '',
city: '', city: '',
county: '', county: '',
area_code: '', areaCode: '',
postal_code: '', postalCode: '',
address_detail: '', addressDetail: '',
is_default: false isDefault: false
}; };
export default create({ export default create({
@ -148,8 +148,8 @@ export default create({
errorInfo: { errorInfo: {
tel: false, tel: false,
name: false, name: false,
postal_code: false, postalCode: false,
address_detail: false addressDetail: false
} }
}; };
}, },
@ -169,8 +169,8 @@ export default create({
}, },
areaText() { areaText() {
const { province, city, county, area_code } = this.data; const { province, city, county, areaCode } = this.data;
return province && city && county && area_code return province && city && county && areaCode
? `${province} ${city} ${county}` ? `${province} ${city} ${county}`
: ''; : '';
} }
@ -184,32 +184,32 @@ export default create({
...val ...val
}; };
this.setAreaCode(val.area_code); this.setAreaCode(val.areaCode);
}, },
deep: true, deep: true,
immediate: true immediate: true
}, },
areaList() { areaList() {
this.setAreaCode(this.data.area_code); this.setAreaCode(this.data.areaCode);
} }
}, },
methods: { methods: {
onFocus(key) { onFocus(key) {
this.errorInfo[key] = false; this.errorInfo[key] = false;
this.detailFocused = key === 'address_detail'; this.detailFocused = key === 'addressDetail';
this.$emit('focus', key); this.$emit('focus', key);
}, },
onChangeDetail(val) { onChangeDetail(val) {
this.data.address_detail = val; this.data.addressDetail = val;
this.$emit('change-detail', val); this.$emit('change-detail', val);
}, },
onAreaConfirm(values) { onAreaConfirm(values) {
this.showArea = false; this.showArea = false;
this.data.area_code = values[2].code; this.data.areaCode = values[2].code;
this.assignAreaValues(values); this.assignAreaValues(values);
this.$emit('change-area', values); this.$emit('change-area', values);
}, },
@ -223,10 +223,10 @@ export default create({
}, },
onSave() { onSave() {
const items = ['name', 'tel', 'area_code', 'address_detail']; const items = ['name', 'tel', 'areaCode', 'addressDetail'];
if (this.showPostal) { if (this.showPostal) {
items.push('postal_code'); items.push('postalCode');
} }
const isValid = items.every(item => { const isValid = items.every(item => {
@ -252,11 +252,11 @@ export default create({
return value ? '' : $t('nameEmpty'); return value ? '' : $t('nameEmpty');
case 'tel': case 'tel':
return this.telValidator(value) ? '' : $t('telInvalid'); return this.telValidator(value) ? '' : $t('telInvalid');
case 'area_code': case 'areaCode':
return value ? '' : $t('areaEmpty'); return value ? '' : $t('areaEmpty');
case 'address_detail': case 'addressDetail':
return value ? '' : $t('addressEmpty'); return value ? '' : $t('addressEmpty');
case 'postal_code': case 'postalCode':
return value && !/^\d{6}$/.test(value) ? $t('postalEmpty') : ''; return value && !/^\d{6}$/.test(value) ? $t('postalEmpty') : '';
} }
}, },
@ -280,7 +280,7 @@ export default create({
// set area code to area component // set area code to area component
setAreaCode(code) { setAreaCode(code) {
this.data.area_code = code || ''; this.data.areaCode = code || '';
this.$nextTick(() => { this.$nextTick(() => {
const { area } = this.$refs; const { area } = this.$refs;
if (area) { if (area) {

52
packages/address-edit/test/index.spec.js
View File

@ -12,10 +12,10 @@ const addressInfo = {
province: '北京市', province: '北京市',
city: '北京市', city: '北京市',
county: '朝阳区', county: '朝阳区',
address_detail: '详细地址', addressDetail: '详细地址',
area_code: '110101', areaCode: '110101',
postal_code: '10000', postalCode: '10000',
is_default: true isDefault: true
}; };
const createComponent = () => { const createComponent = () => {
@ -77,47 +77,47 @@ it('valid tel', () => {
expect(errorInfo.tel).toBeFalsy(); expect(errorInfo.tel).toBeFalsy();
}); });
it('valid area_code', () => { it('valid areaCode', () => {
const { data, button, errorInfo } = createComponent(); const { data, button, errorInfo } = createComponent();
// area_code empty // areaCode empty
data.area_code = ''; data.areaCode = '';
button.trigger('click'); button.trigger('click');
expect(errorInfo.area_code).toBeTruthy(); expect(errorInfo.areaCode).toBeTruthy();
// area_code invalid // areaCode invalid
data.area_code = '-1'; data.areaCode = '-1';
button.trigger('click'); button.trigger('click');
expect(errorInfo.area_code).toBeTruthy(); expect(errorInfo.areaCode).toBeTruthy();
}); });
it('valid address_detail', () => { it('valid addressDetail', () => {
const { data, field, button, errorInfo } = createComponent(); const { data, field, button, errorInfo } = createComponent();
data.address_detail = ''; data.addressDetail = '';
button.trigger('click'); button.trigger('click');
expect(errorInfo.address_detail).toBeTruthy(); expect(errorInfo.addressDetail).toBeTruthy();
field.at(3).trigger('focus'); field.at(3).trigger('focus');
expect(errorInfo.address_detail).toBeFalsy(); expect(errorInfo.addressDetail).toBeFalsy();
}); });
test('valid postal code', () => { test('valid postal code', () => {
const { vm, data, field, button, errorInfo } = createComponent(); const { vm, data, field, button, errorInfo } = createComponent();
// postal_code invalid // postalCode invalid
data.postal_code = '123'; data.postalCode = '123';
button.trigger('click'); button.trigger('click');
expect(errorInfo.postal_code).toBeTruthy(); expect(errorInfo.postalCode).toBeTruthy();
field.at(4).trigger('focus'); field.at(4).trigger('focus');
expect(errorInfo.postal_code).toBeFalsy(); expect(errorInfo.postalCode).toBeFalsy();
// valid result // valid result
data.postal_code = '123456'; data.postalCode = '123456';
button.trigger('click'); button.trigger('click');
// not show postal_code // not show postalCode
data.postal_code = '156'; data.postalCode = '156';
vm.showPostal = false; vm.showPostal = false;
button.trigger('click'); button.trigger('click');
expect(errorInfo.postal_code).toBeFalsy(); expect(errorInfo.postalCode).toBeFalsy();
}); });
test('select area', () => { test('select area', () => {
@ -137,7 +137,7 @@ test('select area', () => {
expect(data.province).toEqual('北京市'); expect(data.province).toEqual('北京市');
expect(data.city).toEqual('北京市'); expect(data.city).toEqual('北京市');
expect(data.county).toEqual('朝阳区'); expect(data.county).toEqual('朝阳区');
expect(data.area_code).toEqual('123456'); expect(data.areaCode).toEqual('123456');
}); });
test('on change detail', () => { test('on change detail', () => {
@ -169,7 +169,7 @@ test('set/get area code', async() => {
wrapper.vm.setAreaCode('110102'); wrapper.vm.setAreaCode('110102');
await later(50); await later(50);
expect(wrapper.vm.data.area_code).toEqual('110102'); expect(wrapper.vm.data.areaCode).toEqual('110102');
expect(wrapper.vm.getArea()).toEqual([ expect(wrapper.vm.getArea()).toEqual([
{ code: '110000', name: '北京市' }, { code: '110000', name: '北京市' },
{ code: '110100', name: '北京市' }, { code: '110100', name: '北京市' },
@ -186,7 +186,7 @@ test('watch area code', async() => {
propsData: { propsData: {
areaList: {}, areaList: {},
addressInfo: { addressInfo: {
area_code: '110101' areaCode: '110101'
} }
} }
}); });

8
packages/address-edit/zh-CN.md
View File

@ -105,10 +105,10 @@ export default {
| province | 省份 | `String` | | province | 省份 | `String` |
| city | 城市 | `String` | | city | 城市 | `String` |
| county | 区县 | `String` | | county | 区县 | `String` |
| address_detail | 详细地址 | `String` | | addressDetail | 详细地址 | `String` |
| area_code | 地区编码，通过省市区选择获取 | `String` | | areaCode | 地区编码，通过省市区选择获取 | `String` |
| postal_code | 邮政编码 | `String` | | postalCode | 邮政编码 | `String` |
| is_default | 是否为默认地址 | `Boolean` | | isDefault | 是否为默认地址 | `Boolean` |
#### searchResult 数据格式 #### searchResult 数据格式