[javascript/Vue] dayjs에서 요일 한국어 적용하기 (locale/ko)

dayjs 요일 한국어로 표시하기

 

moment.js를 걷어내고 day.js를 메인 날짜 라이브러리로 사용 중이다.

https://ordinary-code.tistory.com/60

[javascript/Vue] moment.js 지원 중단으로 dayjs로 변경하기

 

👩‍🏫dayjs에서 요일 표시하기

기본 날짜 포맷의 경우 영어든 한국어든 상관없이 사용하고 있었는데

dayjs를 이용해서 요일을 표시하게 되었는데,

dayjs에서 요일을 표시하면 기본적으로는 영어 약어로 표시가 된다.

 

만약 dayjs에서 요일을 표시하고 싶다면?

dayjs().format("ddd") //Tue

<template> 
	<div> 현재시간 : {{today}} </div> 
 </template>
 <script>
 	import dayjs from 'dayjs' 
 	export default { 
    	component: { dayjs }, 
        data() {
        	return { 
            	today: dayjs().format("YYYY-MM-DD ddd HH:mm:ss"), 
                } 
            },
        } 
</script>

실행화면

확인해보면 영어 약어로 요일이 표시가 된다.

 

 

 

 

 

🙋‍♀️dayjs 한국어 적용하기

dayjs에서는 다양한 언어를 지원을 하고, 그중 한국어도 당연히 지원이 된다.

dayjs에서 /locale/ko를 연결해서 요일을 한국어로 표시도 가능하다.

import를 통해서 locale을 연결할 수 있다.

 

📌한국어 외 지원되는 언어 확인하기

https://github.com/iamkun/dayjs/tree/dev/src/locale

 

dayjs locale/ko 연결하는 코드

import 'dayjs/locale/ko'
dayjs.locale('ko')

해당 코드를 입력하면, dayjs의 기본 언어를 한국어로 지정해서 사용할 수 있다.

 

<template>
    <div>
        <p>Now : {{today}}</p>
        <p>locale/en : {{enToday}}</p>
    </div>
</template>
<script>
    import dayjs from 'dayjs';
    import 'dayjs/locale/ko';
    dayjs.locale('ko');

    export default {
        component: {
            dayjs
        },
        data() {
            return {
                today: dayjs().format("YYYY-MM-DD ddd HH:mm:ss"),
                enToday: dayjs(new Date).locale('en').format('ddd')
            }
        },
    }
</script>

실행화면

만약 기본은 한국어로 했지만, 또 다른 부분은 영어로 설정하고 싶다면

추가로. locale('en')를 추가해서 또 다른 날짜의 경우 영어로 표시하는 것도 가능하다.