##はじめに
先日の案件で、swiperのpaginationに0を付けて表示したいという要望があった。

公式サイトでは以下の通り。
https://swiperjs.com/demos#pagination-fraction
（なお、IEに関してはV5系以上からサポート外となったため、IEでも使用したい場合はv4.5.1以前のものを使用して下さい。）

今回は、「1/10」となっている箇所を、「01/10」となるように実装する。

##実装編
formatFractionCurrentというパラメーターが存在し、それを使うと現在のnumberの値を取得できるみたい。
今回は、numberに0を加えたいので、paginationを以下のように実装した。

pagination: {
    el: '.swiper-pagination',
    type: 'fraction',
    formatFractionCurrent: function (number) {
        return '0' + number;
    }
}

これで、「01/10」のような形に出来上がり。

##補足
スライドの個数が10個以上のときを考慮して、少し条件分岐を加える必要がある。
（今のままでは、10以上の数値のときに「010/10」となってしまうため。）

取得したnumberの値が10以下のみ、0を加えるようif文で条件式を追加。
これで、思った通りの形になりました。

formatFractionCurrent: function (number) {
    if (number < 10) {
        return '0' + number;
    } else {
        return number;
    }
}

See the Pen swiper fraction > 10 by dan (@___dan) on CodePen.