Vue.Component('Chart', { props : {

list : Object, unit : String, size : {
type : String, default : '150px'
}
}, template : /*html*/`
<div class="list">
<div class="top-panel">
<div>{{total + (unit ?? '')}}</div><div>{{select ?? 'всего'}}</div>
</div>
<div :style="{height: size}" class="chart">
<div @click="told(key)" :style="{height: Math.round(value / column * 100) + '%'}" v-for="(value, key) in list"></div>
</div>
</div>
`,
computed : {
column(){
let max = -Infinity; for(let key in list){
if(max < list[key]) max = list[key]
}
return max + max / 8
},
total(){
if(this.select){
return this.list[this.select]
}
let result = 0; for(let key in this.list){
result = result + this.list[key]
}
return result
}
},
methods : {
told(key){
if(this.select == key){
return this.select = null
}
this.select = key
}
},
data(){
return {
select : null
}
}
});

in html

<chart :list="{'g' : 3, 'f' : 1, 's' : 12}"></chart>

получаю ошибку Error in render: "ReferenceError: list is not defined", при том что list задан и читаем на всех этапах, кроме этого. помогите пожалуйста.

прошу прошения. ошибка была в column функции