screen_rotation
Copied to Clipboard
<!DOCTYPE html> <html lang="en"> <head> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <body> <div id="app"> <h3>Vue Js Convet 2-digit date to a 4-digit date</h3> <p>Original date: {{ date }}</p> <p>Formatted date: {{ formattedDate }}</p> </div> <script type="module"> const app = new Vue({ el: "#app", data() { return { date: '12/30/23' } }, computed: { formattedDate() { const parsedDate = new Date(this.date) return parsedDate.toLocaleDateString('en-US', { year: 'numeric', month: '2-digit', day: '2-digit' }) } } }); </script> <style scoped> #app { font-family: Arial, sans-serif; font-size: 16px; color: #333; padding: 20px; } h3 { font-size: 24px; font-weight: bold; margin-bottom: 10px; } p { font-size: 18px; line-height: 1.5; } </style> </body> </html>