Vue js Array Reverse Method

<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 Reverse Method</h2>
        <p>Reverse feature in Vue JS puts an array's elements in reverse order.</p>
        <p>Reverse object Data</p>
        <button @click="myFunction">Reverse Data </button>
        <ul v-for='result in results'>
          <li>{{result.index_num}}</li>
          <li>{{result.collegeName}}</li>
          <li>{{result.city}}</li>
        </ul>
       
      <p></p>
       
     </div>
      <script type="module">
      import { createApp } from 'vue'
      createApp({
      data()
      { 
        return{ 
         colleges:[
              {
                index_num:1,
                collegeName:'IIIT Ranchi',
                city:'Ranchi'
              },
              {
                 index_num:2,
                 collegeName:'MNIT Allahabad',
                 city:'Prayagraj'
              },
              {
                index_num:3,
                collegeName:'NIT Jamshedpur',
                city:'Jamshedpur'
              }
         ],
         results:''
         
        } 
     }, 
     methods:{ 
         myFunction(){ 
            this.results = this.colleges.reverse(); 
           },
        }
    }).mount('#app')
  </script>

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