From 0f4ddbf13f702c7b244b25cc7f290aa1382f87a4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=99=88=E5=98=89=E6=B6=B5?= <chenjiahan@youzan.com>
Date: Mon, 16 Dec 2019 11:29:59 +0800
Subject: [PATCH] chore: improve code style

---
 src/address-edit/index.js  |  6 +++++-
 src/address-list/Item.tsx  |  2 +-
 src/address-list/index.tsx | 10 +++++-----
 src/area/index.js          | 39 +++++++++++++++++++++++++++-----------
 src/card/index.tsx         |  6 +++---
 5 files changed, 42 insertions(+), 21 deletions(-)

diff --git a/src/address-edit/index.js b/src/address-edit/index.js
index f26643071..852b4460b 100644
--- a/src/address-edit/index.js
+++ b/src/address-edit/index.js
@@ -140,10 +140,12 @@ export default createComponent({
 
     onAreaConfirm(values) {
       values = values.filter(value => !!value);
+
       if (values.some(value => !value.code)) {
         Toast(t('areaEmpty'));
         return;
       }
+
       this.showAreaPopup = false;
       this.assignAreaValues();
       this.$emit('change-area', values);
@@ -151,6 +153,7 @@ export default createComponent({
 
     assignAreaValues() {
       const { area } = this.$refs;
+
       if (area) {
         const detail = area.getArea();
         detail.areaCode = detail.code;
@@ -247,7 +250,8 @@ export default createComponent({
     const onFocus = name => () => this.onFocus(name);
 
     // hide bottom field when use search && detail get focused
-    const hideBottomFields = searchResult && searchResult.length && this.detailFocused;
+    const hideBottomFields =
+      searchResult && searchResult.length && this.detailFocused;
 
     return (
       <div class={bem()}>
diff --git a/src/address-list/Item.tsx b/src/address-list/Item.tsx
index 018fe455c..aa7b3b0b7 100644
--- a/src/address-list/Item.tsx
+++ b/src/address-list/Item.tsx
@@ -94,8 +94,8 @@ function AddressItem(
   return (
     <Cell
       class={bem({ disabled })}
-      valueClass={bem('value')}
       border={false}
+      valueClass={bem('value')}
       clickable={switchable && !disabled}
       scopedSlots={{
         default: genContent,
diff --git a/src/address-list/index.tsx b/src/address-list/index.tsx
index e13bb2710..19c58fc90 100644
--- a/src/address-list/index.tsx
+++ b/src/address-list/index.tsx
@@ -64,11 +64,11 @@ function AddressList(
 
   return (
     <div class={bem()} {...inherit(ctx)}>
-      {slots.top && slots.top()}
+      {slots.top?.()}
       <RadioGroup value={props.value}>{List}</RadioGroup>
       {props.disabledText && <div class={bem('disabled-text')}>{props.disabledText}</div>}
       {DisabledList}
-      {slots.default && slots.default()}
+      {slots.default?.()}
       <div class={bem('bottom')}>
         <Button
           round
@@ -87,15 +87,15 @@ function AddressList(
 
 AddressList.props = {
   list: Array,
+  value: [Number, String],
   disabledList: Array,
   disabledText: String,
   addButtonText: String,
-  value: [Number, String],
+  defaultTagText: String,
   switchable: {
     type: Boolean,
     default: true
-  },
-  defaultTagText: String
+  }
 };
 
 export default createComponent<AddressListProps>(AddressList);
diff --git a/src/area/index.js b/src/area/index.js
index 583b2441c..1783b0071 100644
--- a/src/area/index.js
+++ b/src/area/index.js
@@ -1,10 +1,10 @@
 import { createNamespace } from '../utils';
-import Picker from '../picker';
 import { pickerProps } from '../picker/shared';
+import Picker from '../picker';
 
 const [createComponent, bem] = createNamespace('area');
 
-const COLUMNSPLACEHOLDERCODE = '000000';
+const PLACEHOLDER_CODE = '000000';
 
 function isOverseaCode(code) {
   return code[0] === '9';
@@ -56,11 +56,11 @@ export default createComponent({
       return this.columns.slice(0, +this.columnsNum);
     },
 
-    typeToColumnsPlaceholder() {
+    placeholderMap() {
       return {
         province: this.columnsPlaceholder[0] || '',
         city: this.columnsPlaceholder[1] || '',
-        county: this.columnsPlaceholder[2] || '',
+        county: this.columnsPlaceholder[2] || ''
       };
     }
   },
@@ -110,12 +110,18 @@ export default createComponent({
         result = result.filter(item => item.code.indexOf(code) === 0);
       }
 
-      if (this.typeToColumnsPlaceholder[type] && result.length) {
+      if (this.placeholderMap[type] && result.length) {
         // set columns placeholder
-        const codeFill = type === 'province' ? '' : type === 'city' ? COLUMNSPLACEHOLDERCODE.slice(2, 4) : COLUMNSPLACEHOLDERCODE.slice(4, 6);
+        const codeFill =
+          type === 'province'
+            ? ''
+            : type === 'city'
+              ? PLACEHOLDER_CODE.slice(2, 4)
+              : PLACEHOLDER_CODE.slice(4, 6);
+
         result.unshift({
           code: `${code}${codeFill}`,
-          name: this.typeToColumnsPlaceholder[type]
+          name: this.placeholderMap[type]
         });
       }
 
@@ -150,10 +156,12 @@ export default createComponent({
         if (!value) return value;
 
         value = JSON.parse(JSON.stringify(value));
+
         if (!value.code || value.name === this.columnsPlaceholder[index]) {
           value.code = '';
           value.name = '';
         }
+
         return value;
       });
     },
@@ -161,8 +169,10 @@ export default createComponent({
     onChange(picker, values, index) {
       this.code = values[index].code;
       this.setValues();
+
       let getValues = picker.getValues();
       getValues = this.parseOutputValues(getValues);
+
       this.$emit('change', picker, getValues, index);
     },
 
@@ -177,7 +187,7 @@ export default createComponent({
 
       if (!code) {
         if (this.columnsPlaceholder.length) {
-          code = COLUMNSPLACEHOLDERCODE;
+          code = PLACEHOLDER_CODE;
         } else if (Object.keys(this.county)[0]) {
           code = Object.keys(this.county)[0];
         } else {
@@ -196,7 +206,11 @@ export default createComponent({
       picker.setColumnValues(0, province);
       picker.setColumnValues(1, city);
 
-      if (city.length && code.slice(2, 4) === '00' && !this.isOverseaCode(code)) {
+      if (
+        city.length &&
+        code.slice(2, 4) === '00' &&
+        !this.isOverseaCode(code)
+      ) {
         [{ code }] = city;
       }
 
@@ -230,8 +244,11 @@ export default createComponent({
       }
 
       const names = values.map(item => item.name);
-      const filterCodeValues = values.filter(value => !!value.code);
-      area.code = filterCodeValues.length ? filterCodeValues[filterCodeValues.length - 1].code : '';
+      const validValues = values.filter(value => !!value.code);
+
+      area.code = validValues.length
+        ? validValues[validValues.length - 1].code
+        : '';
 
       if (this.isOverseaCode(area.code)) {
         area.country = names[1] || '';
diff --git a/src/card/index.tsx b/src/card/index.tsx
index dce7f655c..21cfe56b1 100644
--- a/src/card/index.tsx
+++ b/src/card/index.tsx
@@ -175,15 +175,15 @@ function Card(
           <div>
             {Title()}
             {Desc()}
-            {slots.tags && slots.tags()}
+            {slots.tags?.()}
           </div>
           {showBottom && (
             <div class="van-card__bottom">
-              {slots['price-top'] && slots['price-top']()}
+              {slots['price-top']?.()}
               {Price()}
               {OriginPrice()}
               {Num()}
-              {slots.bottom && slots.bottom()}
+              {slots.bottom?.()}
             </div>
           )}
         </div>