我正在使用 Vu3 打字稿。我想將 echarts 注入到組件中。但是打字稿一直問我我注入的 echarts 是什么型別。這就是為什么我使用任何型別作為解決方案的原因。但我認為這不是一個好方法。你們能告訴我 echarts 是什么型別的嗎?
插件檔案(提供 echarts 的地方):
import * as echarts from "echarts";
import { App } from "vue";
export default {
install: (app: App) => {
app.provide("echarts", echarts);
},
};
組件檔案:
<template>
<div ref="theChart" :style="{ height: '500px' }"></div>
</template>
<script lang="ts">
import { defineComponent, inject } from "vue";
export default defineComponent({
name: "login",
components: {},
setup() {
const echarts: any = inject("echarts");
return {
echarts,
};
},
mounted() {
this.drawChart();
},
methods: {
drawChart() {
//Initialize the echarts instance based on the prepared dom
let myChart = this.echarts.init(this.$refs.theChart, null, { renderer: 'svg' });
//Specify configuration items and data for the chart
let option = {
title: {
text: "ECharts Introductory example",
},
tooltip: {},
legend: {
data: ["Sales volume"],
},
xAxis: {
data: [
"shirt",
"Cardigan",
"Chiffon shirt",
"trousers",
"High-heeled shoes",
"Socks",
],
},
yAxis: {},
series: [
{
name: "Sales volume",
type: "bar",
data: [5, 20, 36, 10, 10, 20],
},
],
};
//Use the configuration items and data just specified to display the chart.
myChart.setOption(option, true);
},
},
});
</script>
當我寫
const echarts = inject("echarts");
它顯示錯誤 TS2571:以下代碼的物件型別為“未知”
let myChart = this.echarts.init(this.$refs.theChart, null, { renderer: 'svg' });
uj5u.com熱心網友回復:
有兩種解決方式,你可以選擇一種你方便的方式
1、如果你使用的是npm,echarts默認的ts型別在一個單獨的npm包中,你可以嘗試引入它而不是任何
npm install --save-dev @types/echarts
2、可以定義一個.d.ts檔案,自己定義型別
declare module "echarts" {
//the function or properties you may need to use
}
你使用了provide,inject,但是沒有任何意義,你可以在需要的時候匯入echarts
//@types/echarts does not need to import
import echarts from 'echarts'
app.provide('echarts',echarts);
//you use inject
const echarts = inject<typeof echarts>('echarts');
轉載請註明出處,本文鏈接:https://www.uj5u.com/ruanti/383515.html
上一篇:省略擴展特定型別的屬性
