feat: 移除defaultProps，替换为默认值和解构赋值默认赋值 (#231)

* feat: 移除defaultProps，替换为默认值和解构赋值默认赋值 * feat: prettier code
antvis · Jun 12, 2024 · c5141c8 · c5141c8
1 parent c99b386
commit c5141c8
Show file tree

Hide file tree

Showing 7 changed files with 50 additions and 67 deletions.
diff --git a/docs/blocks/administrative-select/administrative-select.tsx b/docs/blocks/administrative-select/administrative-select.tsx
@@ -47,10 +47,25 @@ const getCascadeData = (list: any[]) => {
   }
 };
 
+const defaultCascaderProps = {
+  placeholder: '可选择省/市/县',
+  expandTrigger: 'hover',
+  allowClear: true,
+  changeOnSelect: true,
+  showSearch: true,
+};
+
 export const AdministrativeSelect: React.FC<AdministrativeSelectProps> = ({
-  enableBoundary,
-  autoFit,
-  boundaryLayer,
+  enableBoundary = true,
+  autoFit = true,
+  boundaryLayer = {
+    shape: 'line',
+    color: '#ff0000',
+    size: 2,
+    style: {
+      opacity: 0.8,
+    },
+  },
   value: originValue,
   onChange,
   ...props
@@ -123,6 +138,7 @@ export const AdministrativeSelect: React.FC<AdministrativeSelectProps> = ({
           }
         }}
         multiple={false}
+        {...defaultCascaderProps}
         {...props}
       />
       {enableBoundary && (
@@ -136,21 +152,3 @@ export const AdministrativeSelect: React.FC<AdministrativeSelectProps> = ({
     </>
   );
 };
-
-AdministrativeSelect.defaultProps = {
-  placeholder: '可选择省/市/县',
-  expandTrigger: 'hover',
-  allowClear: true,
-  changeOnSelect: true,
-  enableBoundary: true,
-  autoFit: true,
-  showSearch: true,
-  boundaryLayer: {
-    shape: 'line',
-    color: '#ff0000',
-    size: 2,
-    style: {
-      opacity: 0.8,
-    },
-  },
-};
diff --git a/docs/blocks/draw-modal/DrawModal.tsx b/docs/blocks/draw-modal/DrawModal.tsx
@@ -63,11 +63,23 @@ const DrawModalContent: React.FC<
   );
 });
 
+const defaultModalProps = {
+  width: 700,
+  title: '绘制弹框',
+  cancelText: '取消',
+  okText: '提交',
+  destroyOnClose: true,
+}
+
 export const DrawModal: React.FC<DrawModalProps> = ({
   className,
   larkmapProps,
-  drawConfig,
-  locationSearchProps,
+  drawConfig = {
+    point: true,
+    line: true,
+    polygon: true,
+  },
+  locationSearchProps = false,
   onOk,
   ...modalProps
 }) => {
@@ -90,6 +102,7 @@ export const DrawModal: React.FC<DrawModalProps> = ({
       onOk={() => {
         onOk?.(drawData);
       }}
+      {...defaultModalProps}
       {...modalProps}
     >
       <LarkMap style={{ height: 400 }} {...larkmapProps}>
@@ -98,17 +111,3 @@ export const DrawModal: React.FC<DrawModalProps> = ({
     </Modal>
   );
 };
-
-DrawModal.defaultProps = {
-  drawConfig: {
-    point: true,
-    line: true,
-    polygon: true,
-  },
-  width: 700,
-  title: '绘制弹框',
-  cancelText: '取消',
-  okText: '提交',
-  locationSearchProps: false,
-  destroyOnClose: true,
-};
diff --git a/src/components/Control/CustomControl/index.tsx b/src/components/Control/CustomControl/index.tsx
@@ -7,7 +7,7 @@ import { getStyleText } from '../../../utils';
 import type { CustomControlProps } from './types';
 
 export const CustomControl: React.FC<CustomControlProps> = (props): React.ReactPortal => {
-  const { className, style, children, position, name } = props;
+  const { className, style, children, position = 'topleft', name } = props;
   const containerRef = useRef(document.createElement('div'));
   const styleText = getStyleText(style);
 
@@ -30,4 +30,4 @@ export const CustomControl: React.FC<CustomControlProps> = (props): React.ReactP
   return createPortal(children, containerRef.current);
 };
 
-CustomControl.defaultProps = { position: 'topleft' };
+
diff --git a/src/components/Legend/LegendCategories/index.tsx b/src/components/Legend/LegendCategories/index.tsx
@@ -7,7 +7,7 @@ import type { LegendCategoriesProps } from './types';
 export const CLS_PREFIX = 'larkmap-legend-category';
 
 export function LegendCategories(props: LegendCategoriesProps) {
-  const { labels, colors, geometryType = 'circle', isStrokeColor, style, className: cls_name } = props;
+  const { labels, colors, geometryType = 'circle', isStrokeColor = false, style, className: cls_name } = props;
 
   function getColor(item: string) {
     return isStrokeColor ? { border: `2px solid ${item}` } : { background: item };
@@ -39,8 +39,3 @@ export function LegendCategories(props: LegendCategoriesProps) {
   }
   return <Renders />;
 }
-
-LegendCategories.defaultProps = {
-  geometryType: 'circle',
-  isStrokeColor: false,
-};
diff --git a/src/components/Legend/LegendProportion/index.tsx b/src/components/Legend/LegendProportion/index.tsx
@@ -82,7 +82,3 @@ export const LegendProportion = (props: LegendProportionProp) => {
     </div>
   );
 };
-
-LegendProportion.defaultProps = {
-  fillColor: '#f9f9f9',
-};
diff --git a/src/components/Legend/LegendRamp/index.tsx b/src/components/Legend/LegendRamp/index.tsx
@@ -104,7 +104,7 @@ function DisContinuous({
 }
 
 export function LegendRamp(props: LegendRampProps) {
-  const { isContinuous, labels, colors, labelUnit, className: cls, style } = props;
+  const { isContinuous = false, labels, colors, labelUnit = '', className: cls, style } = props;
 
   // const [min, max] = getMinMax(labels);
   // const isError = Number.isNaN(min) || Number.isNaN(max);
@@ -120,8 +120,3 @@ export function LegendRamp(props: LegendRampProps) {
     </div>
   );
 }
-
-LegendRamp.defaultProps = {
-  isContinuous: false,
-  labelUnit: '',
-};
diff --git a/src/components/LocationSearch/index.tsx b/src/components/LocationSearch/index.tsx
@@ -9,10 +9,19 @@ import type { LocationSearchOption, LocationSearchProps } from './types';
 
 const { Option } = Select;
 
+const defaultSelectProps = {
+  placeholder: '请输入要搜索地名',
+  showSearch: true,
+  allowClear: true,
+  filterOption: false,
+  defaultActiveFirstOption: false,
+};
+
+
 export const LocationSearch: React.FC<LocationSearchProps> = ({
   searchParams,
-  showDistrict,
-  showAddress,
+  showDistrict = true,
+  showAddress = true,
   onSearchFinish,
   onChange,
   ...selectProps
@@ -69,6 +78,7 @@ export const LocationSearch: React.FC<LocationSearchProps> = ({
       onSearch={onSearch}
       onChange={onLocationChange}
       clearIcon={() => null}
+      {...defaultSelectProps}
       {...selectProps}
     >
       {options.map((option) => {
@@ -89,13 +99,3 @@ export const LocationSearch: React.FC<LocationSearchProps> = ({
     </Select>
   );
 };
-
-LocationSearch.defaultProps = {
-  placeholder: '请输入要搜索地名',
-  showSearch: true,
-  allowClear: true,
-  filterOption: false,
-  defaultActiveFirstOption: false,
-  showAddress: true,
-  showDistrict: true,
-};
-Original file line number
+Diff line change
@@ Expand Up @@
         </div>
       );
     };
-    LegendProportion.defaultProps = {
-      fillColor: '#f9f9f9',
-    };