Vue 3 Map Array

<html>

<head>
    <script type="importmap">
      {
        "imports": {
          "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js"
        }
      }
    </script>

<body>
    <div id="app">
        <h2>Vue js Object Map Method (Options Api)</h2>
        <p>Get details of employee using Map method in Vue Js </p>
        <button @click="myFunction">click me to Make Name Uppercase</button>
        <p></p>
        <p>{{results}}</p>
    </div>
    <script type="module">
        import { createApp } from 'vue'
        createApp({
            data() {
                return {
                    employee: [{
                        'name': 'Andrew',
                        'email': 'andrw@gmail.com',
                        'role': 'Developer'
                    },
                    {
                        'name': 'Smith',
                        'email': 'smith@gmail.com',
                        'role': 'Marketing',
                    },
                    {
                        'name': 'Elon',
                        'email': 'elon@gmail.com',
                        'role': 'enterpaeneur'
                    }
                    ],
                    results: []
                }
            },
            methods: {
                myFunction() {
                    this.results = this.employee.map((e) => e.name.toUpperCase());
                },
            }
        }).mount('#app')
    </script>
</body>
</head>

</html>