VueCli+SpringBoot（路由、主入口、弹窗、axios请求、数据遍历、结合Echarts）（前端）二

IT行业相对于一般传统行业，发展更新速度更快，一旦停止了学习，很快就会被行业所淘汰。所以我们需要踏踏实实的不断学习，精进自己的技术，尤其是初学者。今天golang学习网给大家整理了《VueCli+SpringBoot（路由、主入口、弹窗、axios请求、数据遍历、结合Echarts）（前端）二》，聊聊MySQL、前端、Java、vue.js，我们一起来看看吧！

Vue Cli目录

VueCli官网：https://element.eleme.io/#/zh-CN

VueCli写法

:    等于    v-bind

router/index.js

//引入模块
import Vue from 'vue'
import VueRouter from 'vue-router'
import Home from '../views/Home.vue'
import Music from '../views/Music.vue'
import Test from '../views/Test.vue'

Vue.use(VueRouter)

//path是路由参数，当路径匹配到当前路由参数时，就会跳转component所对应的页面组件
const routes = [
  {
    path: '/',            //首页
    name: 'Home',
    component: Home
  },
  {
    path: '/about',        //模块路径
    name: 'About',
    component: Aubot
  },
  {
    path: '/music',        //模块路径
    name: 'Music',
    component: Music
  },
  {
    path: '/test',        //模块路径
    name: 'Test',
    component: Test
  }
]

const router = new VueRouter({
  routes
})

export default router

app.vue 为主入口

views/About

功能

1、弹窗

2、加载页面执行方法、打印

3、axios连接接口 get、post、delete请求

4、el-table遍历、 :formatter数据格式化（1、2转化为男、女）、 slot- scope获取当前列的数据信息

5、接口设置好下载样式 重新打开一个页面调用该方法下载

6、分页

7、结合Echarts图表

好了，本文到此结束，带大家了解了《VueCli+SpringBoot（路由、主入口、弹窗、axios请求、数据遍历、结合Echarts）（前端）二》，希望本文对你有所帮助！关注golang学习网公众号，给大家分享更多数据库知识！