I would like to use c3 charts in my vue js project so I downloaded this package https://github.com/chryb/vue-c3 First of all, I have problems with creating handler property in main component, due to the fact that example shows that we need to create this property with new Vue() value: handler: new Vue()
and Vue returns error: Vue is not defined.
Secondly i dont understand why example shows event like: this.handler.$emit('init', options)
. Shouldnt be it something like this.$emit('init', options)
, cause the example ones returns an error?
Could someone explain how to properly use this vue-c3 package?
Here is my code:
Main component:
<template>
<div>
<vue-chart @myEvent="init" :handler="handler"></vue-chart>
</div>
</template>
<script>
import VueChart from '@/components/VueChart'
export default {
name: 'HelloWorld',
data () {
return {
handler: {}
}
},
components: { VueChart }
}
</script>
Chart component:
<template>
<div>
Content
</div>
</template>
<script>
export default {
name: 'VueChart',
props: ['handler'],
mounted () {
const options = {
data: {
columns: [
['data1', 2, 4, 5],
['data2', 1, 8, 9]
]
}
}
this.$emit('init', options)
}
}
</script>
Too late obviously, to be useful to the OP, but anyway:
import Vue from 'vue'
in the file where you write new Vue()
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.