chore: array fill (#8263)

src/calendar/components/Month.tsx

@@ -195,13 +195,9 @@ export default createComponent({
       }
     };
 
-    const placeholders = computed(() => {
-      const rows: DayItem[] = [];
+    const placeholders = computed<DayItem[]>(() => {
       const count = Math.ceil((totalDay.value + offset.value) / 7);
-      for (let day = 1; day <= count; day++) {
-        rows.push({ type: 'placeholder' });
-      }
-      return rows;
+      return Array(count).fill({ type: 'placeholder' });
     });
 
     const days = computed(() => {

src/index-bar/index.tsx

@@ -41,12 +41,10 @@ export type IndexBarProvide = {
 };
 
 function genAlphabet() {
-  const indexList = [];
   const charCodeOfA = 'A'.charCodeAt(0);
-
-  for (let i = 0; i < 26; i++) {
-    indexList.push(String.fromCharCode(charCodeOfA + i));
-  }
+  const indexList = Array(26)
+    .fill('')
+    .map((_, i) => String.fromCharCode(charCodeOfA + i));
 
   return indexList;
 }

src/loading/index.tsx

@@ -3,10 +3,7 @@ import { createNamespace, addUnit, getSizeStyle } from '../utils';
 
 const [createComponent, bem] = createNamespace('loading');
 
-const SpinIcon: JSX.Element[] = [];
-for (let i = 0; i < 12; i++) {
-  SpinIcon.push(<i />);
-}
+const SpinIcon: JSX.Element[] = Array(12).fill(<i />);
 
 const CircularIcon = (
   <svg class={bem('circular')} viewBox="25 25 50 50">

src/number-keyboard/index.tsx

@@ -85,10 +85,9 @@ export default createComponent({
     const root = ref<HTMLElement>();
 
     const genBasicKeys = () => {
-      const keys: KeyConfig[] = [];
-      for (let i = 1; i <= 9; i++) {
-        keys.push({ text: i });
-      }
+      const keys: KeyConfig[] = Array(9)
+        .fill('')
+        .map((_, i) => ({ text: i + 1 }));
 
       if (props.randomKeyOrder) {
         keys.sort(() => (Math.random() > 0.5 ? 1 : -1));

src/rate/index.tsx

@@ -73,13 +73,11 @@ export default createComponent({
     const untouchable = () =>
       props.readonly || props.disabled || !props.touchable;
 
-    const list = computed(() => {
-      const list: RateStatus[] = [];
-      for (let i = 1; i <= props.count; i++) {
-        list.push(getRateStatus(props.modelValue, i, props.allowHalf));
-      }
-      return list;
-    });
+    const list = computed<RateStatus[]>(() =>
+      Array(props.count)
+        .fill('')
+        .map((_, i) => getRateStatus(props.modelValue, i + 1, props.allowHalf))
+    );
 
     const select = (index: number) => {
       if (!props.disabled && !props.readonly && index !== props.modelValue) {

src/skeleton/index.tsx

@@ -73,17 +73,12 @@ export default createComponent({
       return rowWidth;
     };
 
-    const renderRows = () => {
-      const Rows: JSX.Element[] = [];
-
-      for (let i = 0; i < props.row; i++) {
-        Rows.push(
+    const renderRows = () =>
+      Array(props.row)
+        .fill('')
+        .map((_, i) => (
           <div class={bem('row')} style={{ width: addUnit(getRowWidth(i)) }} />
-        );
-      }
-
-      return Rows;
-    };
+        ));
 
     return () => {
       if (!props.loading) {