前端開發中，會遇到字元串填充的問題，padStart() 和 padEnd()

如圖顯示要求

原本是直接選擇時間就沒問題了，但是又改變了需求，就是選擇時間後可以選擇批次号，

有兩種方法，可以做。先了解需要用到的js 文法

第一種 map 循環

定義一個方法名字，一會友善調用
const hourPici = new Array(24).fill(1).map((item,index)=>{
  return {
    value: (index+1).toString().padStart(2,'0'),
    label: (index+1).toString().padStart(2,'0')
  }
})

調用的地方：
  {
    title: '批次号',
    name: 'batchNO',
    span: 24,
    formOption: {
      type: '$radio', props: {
        options: hourPici
      }
    }
  },
           

解析上述方法

1 fill() 方法用一個固定值填充一個數組中從起始索引到終止索引内的全部元素。不包括終止索引。

可檢視網址介紹 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Array/fill

2 toString() 方法可把一個 Number 對象轉換為一個字元串，并傳回結果。

可檢視 https://www.w3school.com.cn/jsref/jsref_tostring_number.asp 介紹

3 ES2017 引入了字元串補全長度的功能。

如果某個字元串不夠指定長度，會在頭部或尾部補全。padStart()用于頭部補全，padEnd()用于尾部補全

str.padStart(targetLength,string)：使用指定字元串填充到目标字元串前面，使其達到目标長度；

str.padEnd(targetLength,string)：使用指定字元串填充到目标字元串後面，使其達到目标長度；

可以看一下這個人的部落格，寫的padStart 和 padEnd介紹

https://blog.csdn.net/ixygj197875/article/details/79090578

第二種方法直接for循環

首先定義一個空數組

然後進行循環 push 尾部增加就可以了，注意

padStart( 2, “0”)，使用指定字元串填充到目标字元串前面，使其達到目标長度；

let monList = [];
for (var i = 1; i < 13; i++) { // 如果到24 ,你就小于25 
    monList.push((i + "").padStart( 2, "0"))
}
引用方法
{
    title: '批次号',
    name: 'batchNO',
    span: 24,
    formOption: {
      type: '$radio', props: {
        options: monList 
      }
    }
  }