Vue Js Concat Array

<script type="importmap">
  {
    "imports": {
      "vue": "https://unpkg.com/vue@3/dist/vue.esm-browser.js"
    }
  }
</script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-F3w7mX95PdgyTmZZMECAngseQB83DfGTowi0iMjiWaeVhAn4FJkqJByhZMI3AhiU" crossorigin="anonymous">
  <div id="app" class='container-fluid'>
    <h1>Vue Js merge Array using Spread operator</h1>
    <p>To combine two or more arrays using spread operator</p>
    
    <P>First Name : {{firstName}}</P>
    <P>Last Name :  {{lastName}}</P>
    <P>Full Name : {{fullName}}</P>
    <button @click="concatFunction" class="btn btn-primary">Concat Array</button>
  </div>
<script type="module">
    import { createApp } from 'vue'

createApp({
   data()
  { 
    return { 
          firstName : ['David'], 
          lastName: ['Root'], 
          fullName:[] 
         } 
  }, 
   methods:{ 
    concatFunction : function()
            { 
              this.fullName = [...this.firstName,...this.lastName]; 
               } 
  }
  }).mount('#app')
</script>