图表是应用程序向用户显示信息/数据的一种方法。在本文中，我将向你精确演示如何使用Vue-apexcharts。
从头开始
使用VueCLI，我们可以轻松创建启动程序。首先，我们需要使用以下命令安装VueCLI。如果已安装，则可以跳过此步骤。注意：要使用CLI，你需要安装Node.js-8或更高的版本（建议使用8.10.0+）。要安装CLI，请在终端中运行以下命令：
现在，我们可以使用它来创建我们的项目。我们将使用以下命令创建项目：
然后，系统将提示你选择默认预设或手动选择功能的选项。选择default。将创建一个新的项目目录，你可以使用以下命令导航到该目录：
安装Apexcharts
ApexCharts是一个现代的图表库，可帮助开发人员为网页创建漂亮的交互式可视化文件。我们可以通过集成其针对Vue的组件vue-apexcharts来轻松地将ApexCharts与我们的Vue应用程序一起使用。使用下面的命令为我们的应用程序安装vue-apexcharts组件：
配置vue-apexcharts
现在我们已经安装了vue-apexcharts。打开src目录并创建一个名为的新目录plugins。在新的插件目录中，创建一个名为的文件apexcharts.js。
接下来，为顶点图表创建Vue组件apexcharts.js。让组件在我们的应用程序中全局可用。
为此，我们将同时导入Vue和vue-apexcharts。接下来，我们将创建一个名为全局组件的apexchart。这是apexcharts.js文件：
导入我们的插件文件
我们必须让Vue知道我们刚刚创建的文件。为此，我们将其导入main.js文件中。打开main.js文件，并在最后一个import语句之后添加以下行：
现在我们准备创建我们的第一个图表。
创建我们的第一个图表
我们在HelloWorld组件中创建图表。当我们使用VueCLI创建应用程序时，会自动创建此组件。打开文件HelloWorld.vue并删除里面所有的演示代码。你的文件应如下所示：
记住，在我们的插件中，我们称它为