Vue Js Timestamp on a change event in a Dropdown menu

<html>
<head>
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
</head>
<body>
    <div id="app">
        <h3>Vue Js Timestamp on a change event in a Dropdown menu</h3>
        <div class="dropdown">
            <select v-model="selectedValue" @change="updateTimestamp">
                <option value="">Select an option</option>
                <option value="Vue Js">Vue Js</option>
                <option value="React Js">React Js</option>
                <option value="Angular Js">Angular Js</option>
            </select>
        </div>
        <div class="timestamp-container" v-if="timestamp">Selected at: {{ timestamp }}</div>
    </div>

const formattedDate = now.toLocaleDateString(undefined, dateOptions);
                    const formattedTime = now.toLocaleTimeString(undefined, timeOptions);

this.timestamp = `${formattedDate} ${formattedTime}`;
                }
            }
        });
    </script>

.dropdown {
            position: relative;
            display: inline-block;
        }

.dropdown select {
            padding: 8px 16px;
            font-size: 14px;
            border: 1px solid #ccc;
            border-radius: 4px;
            background-color: #fff;
            color: #333;
        }

.timestamp-container {
            margin-top: 10px;
            font-size: 16px;
            font-weight: bold;
        }

/* Style the selected option */
        .dropdown select option:checked {
            background-color: #f0f0f0;
        }
    </style>
</body>

</html>