how to loop through data in vuejs

This is my database schema :

This is the component template :

<template>
  <div>
    <div id="chart"></div>
    <div v-for="revenue in revenues" :key="revenue._id">
      {{revenue.income}}
    </div>
    {{revenues}}
  </div>
</template>

<script>
import ApexCharts from 'apexcharts';
import axios from "axios"

export default {
  data(){
    return{
      revenues:""
    };
  },
  mounted() {
     axios
      .get(`http://localhost:5000/api/revenue`, {})
      .then(response => {
        this.revenues = response.data.revenues;
          })
      .catch(error => {
      });
        // this is the harcoded data which displays chart
        var options = {
          series: [{
          name: 'series1',
          data: [31]
        }, {
          name: 'series2',
          data: [11]
        }],
          chart: {
          height: 350,
          type: 'area'
        },
 
        xaxis: {
          type: 'datetime',
          categories: ["2018-09-19T00:00:00.000Z",]
        },
       
        };

        var chart = new ApexCharts(document.querySelector("#chart"), options);
        chart.render();
  },

};
</script>

How can I loop through this data instead of inputing hard coded numbers, this is my json that displays in my broswer.

How can I input revenue.income in my var option data ?

You just have to update your then block in the code

axios
.get(`http://localhost:5000/api/revenue`, {})
.then(response => {
	this.revenues = response.data.revenues;

	const options = {
		series: [],
		chart: {
			height: 350,
			type: 'area'
		},

		xaxis: {
			type: 'datetime',
			categories: ["2018-09-19T00:00:00.000Z",]
		},
	}

	this.revenues.forEach(revenue => {
		options.series.push({ name: revenue.time, data: [revenue.income, revenue.expenses] })
	});

	var chart = new ApexCharts(document.querySelector("#chart"), options);
	chart.render();
}).catch(error => {
	console.error('Error', error)
});

In above code add all the data you want to render in data property of options.series array, right now I have added income and expenses.

I suggest you to create seperate method for this logic and call it inside the then block.