这是我的父母
<template>
<Chart :type="bar" :data="[2,15,3,4,5,1,2,4,10,11]"></Chart>
</template>
<script>
import Chart from "./Chart"
export default {
components: {
Chart
},
}
</script>
这是我的孩子部分:
<template>
<highcharts :options="chartOptions"></highcharts>
</template>
<script>
import {Chart} from 'highcharts-vue'
export default {
props: ["data", "type"],
components: {
highcharts: Chart
},
data() {
return {
chartOptions: {
chart: {
type: this.type
},
series: [{
data: this.data, // sample data
name: "Test Series",
color: "blue"
}]
}
}
}
}
</script>
我能够通过道具传递数据,但不能传递类型。当我将type: this.type
更改为type: "bar"
时,它可以按预期工作,因此代码本身没有错误。
我收到以下警告:
vue.runtime.esm.js?2b0e:619 [Vue warn]: Property or method "bar" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property.
我在做什么错了?
答案 0 :(得分:4)
您正在尝试将bind
prop
“类型”动态<Chart type="bar" :data="[2,15,3,4,5,1,2,4,10,11]"></Chart>
到 bar ,好像最后一个是变量一样。如果要将其作为字符串传递,请执行以下操作:
import math
from decimal import *
pi = Decimal(3)
two = 2
three = 3
four = 4
times = 10000
for c in range(times):
pi += Decimal(4)/two * three * four
pi -= Decimal(4)/two + 2 * three + 2 * four + 2 * three
two += 2
three += 2
four += 4
print(pi)
答案 1 :(得分:1)
您使用:type =“ bar”以便Vue寻找一个称为“ bar”的变量。 如果要将值作为字符串传递,则应在“类型”之前删除“:”。
<template>
<Chart type="bar" :data="[2,15,3,4,5,1,2,4,10,11]"></Chart>
</template>