Vue JS 현재 날짜 및 시간 가져오기
2610 단어 vuejavascripttimedate
vue js에서 생성자는 전체 날짜를 구성하기 위해 다음 메서드를 포함하는 새 날짜 인스턴스를 생성하는 new Date()를 사용하고 있습니다. 따라서 이 예에서는 현재 타임스탬프, 현재 날짜, 현재 월, 현재 연도, 날짜 및 시간을 가져옵니다.
Vue js가 현재 타임스탬프를 가져오는 예를 살펴보겠습니다.
getDate() 함수: 해당 월의 날짜(1-31)를 반환합니다.
getMonth() 함수: 1월은 0이고 12월은 11인 월을 반환합니다.
getFullYear() 함수: 4자리 형식(YYYY)으로 연도를 반환합니다.
Example 1:
이 예제에서는 현재 날짜를 가져오고 현재 시간을 형식으로 가져옵니다.
<!DOCTYPE html>
<html>
<head>
<title>Vue JS Get Current Date And Time - Techsolutionstuff</title>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
<div id="app">
{{ message }}
</div>
</body>
<script type="text/javascript">
new Vue({
el: '#app',
data: {
message:"Welcome, Please Wait...."
},
methods:{
callFunction: function () {
var currentDate = new Date();
console.log(currentDate);
var currentDateWithFormat = new Date().toJSON().slice(0,10).replace(/-/g,'/');
console.log(currentDateWithFormat);
}
},
mounted () {
this.callFunction()
}
});
</script>
</html>
Example 2:
이 예에서는 현재 날짜를 d-m-yyyy 형식으로 가져옵니다.
<template>
<div id="app">
<h1>Get Current Date And Time</h1>
<p>{{currentDate()}}</p>
</div>
</template>
<script>
export default {
methods: {
currentDate() {
const current = new Date();
const date = `${current.getDate()}/${current.getMonth()+1}/${current.getFullYear()}`;
return date;
}
}
};
</script>
Example 3:
이 예제에서는 toLocaleString() 함수를 사용하여 날짜를 표시합니다.
<div id="app-2">
<span v-bind:title="message">
Hover your mouse over me for a few seconds
to see my dynamically bound title!
</span>
</div>
var app2 = new Vue({
el: '#app-2',
data: {
message: 'You loaded this page on ' + new Date().toLocaleString()
}
})
Reference
이 문제에 관하여(Vue JS 현재 날짜 및 시간 가져오기), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://dev.to/techsolutionstuff/vue-js-get-current-date-and-time-3f30텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)