VueJS

<template>
  <div>
    <h1>IPO List</h1>
    <ul>
      <li v-for="ipo in ipos" :key="ipo.id">{{ ipo.name }}</li>
    </ul>
  </div>
</template>
 
<script>
import axios from 'axios';
 
export default {
  data() {
    return {
      ipos: []
    };
  },
  created() {
    this.fetchIpos();
  },
  methods: {
    async fetchIpos() {
      try {
        const response = await axios.get('https://api.ipoalerts.in/ipos?status=open', {
          headers: {
            'x-api-key': 'your_api_key_here'
          }
        });
        this.ipos = response.data.ipos;
      } catch (error) {
        console.error('Error fetching IPO data:', error);
      }
    }
  }
};
</script>