zoukankan      html  css  js  c++  java
  • vue3.x版本安装element-ui、axios及echarts图表插件

    项目中安装使用element-UI

    命令行:

    vue add element

    安装成功后,项目会自动将element-UI引入项目中,刷新项目即可

    项目中安装使用axios数据请求

    vue add axios

    安装成功后,项目会自动将axios引入项目中,刷新项目即可

    配置跨域请求本地服务器后台数据:

    1、在项目根目录下新建文件vue.config.js

    加入以下代码:

    module.exports = {

       runtimeCompiler: true,

       publicPath: '/', // 设置打包文件相对路径

       devServer: {

          // open: process.platform === 'darwin',

          // host: 'localhost',

          port: 8080,//服务器项目运行端口

          // open: true, //配置自动启动浏览器

          proxy: {

            '/api': {

               target: 'http://localhost:88', //自己本地服务器接口

                changeOrigin: true,

               ws: true,

               pathRewrite: {

                  '^/api': ''

                }

            }

          }

       },

    }

    2、src目录下main.js文件加入下面两句话:

    axios.defaults.timeout = 5000 // 请求超时

    axios.defaults.baseURL = '/api/'  // api 即上面 vue.config.js 中配置的地址

    3、组件文件中使用axios进行数据请求:

      例如:

     

    项目中安装使用echarts图表插件

    npm install --save echarts vue-route

  • 相关阅读:
    The bean ‘XXXXX.FeignClientSpecification‘ could not be registered.
    爱数产品
    RSA加解密时报algid parse error, not a sequence错误
    PostgreSQL 查看数据库,索引,表,表空间大小
    Vue3工程示例
    Vue3工程用Vue2示例
    Vue工程添加组件调用
    Vue 项目结构
    命令行创建Vue项目
    Vue 自定义指令
  • 原文地址:https://www.cnblogs.com/zyl-930826/p/11319964.html
Copyright © 2011-2022 走看看