antvis / antvis/F2

VUE3使用F2创建 Chart 对象时提示TypeError: _this.getDefaultCfg is not a function

Open
#1,167 2 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
8k
Forks
637
PR merge metrics
No merged PRs in 30d

Description

我在vue3中使用F2创建图表时,console.log(chart)能够正常打印,说明组件引入成功,但是创建对象后,控制台提示**Uncaught (in promise) TypeError: _this.getDefaultCfg is not a function**请问这是怎么回事
```vue



import {Toast, Slider} from 'vant';
import {onMounted, inject,nextTick} from "vue";
import F2 from '@antv/f2';

export default {
name: "Test",
setup() {
const chart = inject('F2');
const data = [
{genre: 'Sports', sold: 275},
{genre: 'Strategy', sold: 115},
{genre: 'Action', sold: 120},
{genre: 'Shooter', sold: 350},
{genre: 'Other', sold: 150}
]
// Step 1: 创建 Chart 对象
const Chart = chart.Chart({
id: 'myChart',
pixelRatio: window.devicePixelRatio // 指定分辨率
});
const drawChart = () => {
console.log(chart)
console.log(Chart)
}
onMounted(() => {
nextTick(() => {
drawChart()
});
})
return {
data
}
}
}

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the error from the supplied Vue 3 component, focusing on the injected F2 value and the Chart creation call from @antv/f2. Check the F2 Chart API and Vue integration guidance to determine why getDefaultCfg is unavailable. Done means identifying the incompatible usage and documenting or fixing the supported initialization path.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
data-visualization, frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.