<template>
    <div id="app">
        <vue-wordcloud 
            style="width: 500px;height: 500px;"
            :options="options" 
            :loading="loading" />
    </div>
</template>
 
<script>
export default {
    data: function() {
        return { 
            loading: true,
            options: {
                list: [
                    ['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46],['foo', 36], ['bar', 62], ['foo3', 22], ['bar4', 36], ['bar5', 46]
                ],
                color: [
                    ['blue', 'white']
                ]
            }
        }
    },
    mounted() {
        setTimeout(() => {
            this.loading = false
        }, 2000)
    }
}
</script>