swiper의 pagination에 0을 붙이고 표시하고 싶습니다.

소개

이번에는, 「1/10」이 되고 있는 개소를, 「01/10」이 되도록 실장한다.

실장편

formatFractionCurrent라는 파라미터가 존재하고, 그것을 사용하면 현재 number의 값을 얻을 수 있는 것 같다.

이번에는 number에 0을 더하고 싶기 때문에 pagination을 다음과 같이 구현했다.

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

이것으로, 「01/10」과 같은 형태로 완성.

See the Pen swiper fraction by dan ( @___dan )

on CodePen .

보충

슬라이드의 개수가 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 .

참고 기사

아래 사이트에서 매개변수를 검색했습니다.

htps //w w. 쓰리아도 cs. 코 m/트토리아 l/스페 r/아피파기 나치온. HTML