Vue( Nuxt.js ) axios, async, await

<template>

    <div>

        <ul>

            <li v-for="( item, index ) in list" :key="index">

                <span>{{ item.id }}</span>:<span>{{ item.data }}</span>

            </li>

        </ul>

    </div>

</template>

 

<script>

import axios from "axios";

export default {

    data(){

        return{

            list : []

        }

    },

 

    mounted(){

        let links = [

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74", 

            "https://api.myjson.com/bins/t4u74"

        ];

 

        this.load( links );

    },

 

    methods : {

        async load( $links ){

            let list = [];

 

            var i = 0;

            var len = $links.length;

            var result;

 

            for( i; i<len; i++ )

            {

                result = await axios.get( $links[ i ]);

                this.list.push({ id : i, data : result.data });

            }

        },

    }

}

</script>