Vue js Array lastindexOf Function

<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 array.lastIndexOf() function from object</h2>
        <p>Get last Index of England</p>
       <button @click="myFunction">Get last Index</button>
      <p></p>
        <p>Last Index: {{result}}</p>
     </div>
      <script type="module">
      import { createApp } from 'vue'
      createApp({
      data()
      { 
        return{ 
         countries:[
                  {
                   'countryName': 'India'
                  },
                  {
                   'countryName':'England'
                  },
                  {
                   'countryName':'America'
                  },
                  {
                    'countryName':'Africa'
                  },
                  {
                   'countryName':'England'
                  }
                   ],
         result : ''
        }
     }, 
     methods:{ 
         myFunction(){ 
            this.result = this.countries.map((country) => country.countryName).lastIndexOf('England') 
           },
          }
      }).mount('#app')
  </script>

</body>
  </head>
</html>