董文轩的VUE实训(一)~(六)

1.安装 nodejs

2.安装 git

3.下载 vue-admin-template

删除多余界面 router/index

删除后的界面如下


import Vue from 'vue'

import Router from 'vue-router'

Vue.use(Router)

/* Layout */

import Layout from '@/layout'

/**

* Note: sub-menu only appear when route children.length >= 1

* Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html

*

* hidden: true                  if set true, item will not show in the sidebar(default is false)

* alwaysShow: true              if set true, will always show the root menu

*                                if not set alwaysShow, when item has more than one children route,

*                                it will becomes nested mode, otherwise not show the root menu

* redirect: noRedirect          if set noRedirect will no redirect in the breadcrumb

* name:'router-name'            the name is used by  (must set!!!)

* meta : {

    roles: ['admin','editor']    control the page roles (you can set multiple roles)

    title: 'title'              the name show in sidebar and breadcrumb (recommend set)

    icon: 'svg-name'            the icon show in the sidebar

    breadcrumb: false            if set false, the item will hidden in breadcrumb(default is true)

    activeMenu: '/example/list'  if set path, the sidebar will highlight the path you set

  }

*/

/**

* constantRoutes

* a base page that does not have permission requirements

* all roles can be accessed

*/

export const constantRoutes = [

  {

    path: '/login',

    component: () => import('@/views/login/index'),

    hidden: true

  },

  {

    path: '/404',

    component: () => import('@/views/404'),

    hidden: true

  },

  {

    path: '/',

    component: Layout,

    redirect: '/dashboard',

    children: [{

      path: 'dashboard',

      name: 'Dashboard',

      component: () => import('@/views/dashboard/index'),

      meta: { title: 'Dashboard', icon: 'dashboard' }

    }]

  },

  // 404 page must be placed at the end !!!

  { path: '*', redirect: '/404', hidden: true }

]

const createRouter = () => new Router({

  // mode: 'history', // require service support

  scrollBehavior: () => ({ y: 0 }),

  routes: constantRoutes

})

const router = createRouter()

// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465

export function resetRouter() {

  const newRouter = createRouter()

  router.matcher = newRouter.matcher // reset router

}

export default router

安装ES6语法插件


npm install --save es6-promise

更改http.js


importVuefrom'vue';importAxiosfrom'axios';import{Promise}from'es6-promise';import{MessageBox,Message}from'element-ui'Axios.defaults.timeout=30000;// 1分钟Axios.defaults.baseURL='';Axios.interceptors.request.use(function(config){// Do something before request is sent//change method for get/*if(process.env.NODE_ENV == 'development'){

      config['method'] = 'GET';

      console.log(config)

  }*/if(config['MSG']){// Vue.prototype.$showLoading(config['MSG']);}else{// Vue.prototype.$showLoading();}// if(user.state.token){//用户登录时每次请求将token放入请求头中//  config.headers["token"] = user.state.token;// }if(config['Content-Type']==='application/x-www-form-urlencoded;'){//默认发application/json请求,如果application/x-www-form-urlencoded;需要使用transformRequest对参数进行处理/*config['Content-Type'] = 'application/x-www-form-urlencoded;charset=UTF-8';*/config.headers['Content-Type']='application/x-www-form-urlencoded;charset=UTF-8';config['transformRequest']=function(obj){varstr=[];for(varpinobj)str.push(encodeURIComponent(p)+"="+encodeURIComponent(obj[p]));returnstr.join("&")};}//config.header['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8';returnconfig;},function(error){// Do something with request error// Vue.$vux.loading.hide()returnPromise.reject(error);});Axios.interceptors.response.use(response=>{// Vue.$vux.loading.hide();returnresponse.data;},error=>{// Vue.$vux.loading.hide();if(error.response){switch(error.response.status){case404:Message({message:''||'Error',type:'error',duration:5*1000})break;default:Message({message:''||'Error',type:'error',duration:5*1000})}}elseif(errorinstanceofError){console.error(error);}else{Message({message:''||'Error',type:'error',duration:5*1000})}returnPromise.reject(error.response);});exportdefaultVue.prototype.$http=Axios;

更改vue.config.js


'use strict'constpath=require('path')constdefaultSettings=require('./src/settings.js')functionresolve(dir){returnpath.join(__dirname,dir)}constname=defaultSettings.title||'vue Admin Template'// page title// If your port is set to 80,// use administrator privileges to execute the command line.// For example, Mac: sudo npm run// You can change the port by the following methods:// port = 9528 npm run dev OR npm run dev --port = 9528constport=process.env.port||process.env.npm_config_port||9528// dev port// All configuration item explanations can be find in https://cli.vuejs.org/config/module.exports={/**

  * You will need to set publicPath if you plan to deploy your site under a sub path,

  * for example GitHub Pages. If you plan to deploy your site to https://foo.github.io/bar/,

  * then publicPath should be set to "/bar/".

  * In most cases please use '/' !!!

  * Detail: https://cli.vuejs.org/config/#publicpath

  */publicPath:'/',outputDir:'dist',assetsDir:'static',lintOnSave:process.env.NODE_ENV==='development',productionSourceMap:false,devServer:{port:port,open:true,overlay:{warnings:false,errors:true},proxy:{// change xxx-api/login => mock/login// detail: https://cli.vuejs.org/config/#devserver-proxy[process.env.VUE_APP_BASE_API]:{target:`http://127.0.0.1:${port}/mock`,changeOrigin:true,pathRewrite:{['^'+process.env.VUE_APP_BASE_API]:''}},['/api']:{target:`http://127.0.0.1:3000`,changeOrigin:true,pathRewrite:{['^'+'/api']:''}}},after:require('./mock/mock-server.js')},configureWebpack:{// provide the app's title in webpack's name field, so that// it can be accessed in index.html to inject the correct title.name:name,resolve:{alias:{'@':resolve('src')}}},chainWebpack(config){config.plugins.delete('preload')// TODO: need testconfig.plugins.delete('prefetch')// TODO: need test// set svg-sprite-loaderconfig.module.rule('svg').exclude.add(resolve('src/icons')).end()config.module.rule('icons').test(/\.svg$/).include.add(resolve('src/icons')).end().use('svg-sprite-loader').loader('svg-sprite-loader').options({symbolId:'icon-[name]'}).end()// set preserveWhitespaceconfig.module.rule('vue').use('vue-loader').loader('vue-loader').tap(options=>{options.compilerOptions.preserveWhitespace=truereturnoptions}).end()config// https://webpack.js.org/configuration/devtool/#development.when(process.env.NODE_ENV==='development',config=>config.devtool('cheap-source-map'))config.when(process.env.NODE_ENV!=='development',config=>{config.plugin('ScriptExtHtmlWebpackPlugin').after('html').use('script-ext-html-webpack-plugin',[{// `runtime` must same as runtimeChunk name. default is `runtime`inline:/runtime\..*\.js$/}]).end()config.optimization.splitChunks({chunks:'all',cacheGroups:{libs:{name:'chunk-libs',test:/[\\/]node_modules[\\/]/,priority:10,chunks:'initial'// only package third parties that are initially dependent},elementUI:{name:'chunk-elementUI',// split elementUI into a single packagepriority:20,// the weight needs to be larger than libs and app or it will be packaged into libs or apptest:/[\\/]node_modules[\\/]_?element-ui(.*)/// in order to adapt to cnpm},commons:{name:'chunk-commons',test:resolve('src/components'),// can customize your rulesminChunks:3,//  minimum common numberpriority:5,reuseExistingChunk:true}}})config.optimization.runtimeChunk('single')})}}

main.js中加入http


importhttpfrom'./utils/http'Vue.use(http)

index.vue


.dashboard { &-container { margin: 30px; } &-text { font-size: 30px; line-height: 46px; } }

全局安装koa-generator

cmd输入


npm install -g koa-generator

构建koa2项目的代码


koa2 projectName

成功后会出现的代码:


D:\project>koa2 projectName create:projectName create:projectName/package.json create:projectName/app.js create:projectName/publiccreate:projectName/public/images create:projectName/routes create:projectName/routes/index.js create:projectName/routes/users.js create:projectName/views create:projectName/views/index.pug create:projectName/views/layout.pug create:projectName/views/error.pug create:projectName/public/stylesheets create:projectName/public/stylesheets/style.css create:projectName/bin create:projectName/bin/www install dependencies:>cd projectName&&npm install run the app:>SETDEBUG=koa*&npm start projectName create:projectName/public/javascriptsD:\project>

初始化后台项目插件:


cd projectName

初始化项目(需要安装git)


npm install

项目试运行


npm run dev

出现以下代码代表运行成功


D:\project\projectName>npm run dev>[email protected] D:\project\projectName>nodemon bin/www[nodemon]1.19.4[nodemon]to restart at any time,enter `rs`[nodemon]watchingdir(s):*.*[nodemon]watching extensions:js,mjs,json[nodemon]starting `node bin/www`

在浏览器打开地址:

http://localhost:3000/

出现koa2的欢迎界面就代表成功了。

安装本地mongodb或者在mongodb官网新建免费的云端服务器。

百度搜索MongoDB,在官网下载。创建自己的用户。

我的数据库名字为dwx,密码用*号代替。


dbs:'mongodb+srv://dongwenxuan:******@cluster0.v7rxt.mongodb.net/dwx?retryWrites=true&w=majority'

安装Mongooes


npm install mongoose --save

下面代码中连接密码改成自己的

config.js:


module.exports={// dbs: 'mongodb://139.159.253.110:27017/test1'dbs:'mongodb+srv://xxwozixin:<需要修改>@cluster0-7d5kk.mongodb.net/test?retryWrites=true&w=majority'}

user.js:


constmongoose=require('mongoose')constfeld={name:String,age:Number,//人物标签labels:Number}//自动添加更新时间创建时间:letpersonSchema=newmongoose.Schema(feld,{timestamps:{createdAt:'created',updatedAt:'updated'}})module.exports=mongoose.model('User',personSchema)

app.js:


constKoa=require('koa')constapp=newKoa()constviews=require('koa-views')constjson=require('koa-json')constonerror=require('koa-onerror')constbodyparser=require('koa-bodyparser')constlogger=require('koa-logger')constindex=require('./routes/index')constusers=require('./routes/users')constmongoose=require('mongoose')constdbconfig=require('./db/config')mongoose.connect(dbconfig.dbs,{useNewUrlParser:true,useUnifiedTopology:true})constdb=mongoose.connectiondb.on('error',console.error.bind(console,'connection error:'));db.once('open',function(){console.log('mongoose 连接成功')});// error handleronerror(app)// middlewaresapp.use(bodyparser({enableTypes:['json','form','text']}))app.use(json())app.use(logger())app.use(require('koa-static')(__dirname+'/public'))app.use(views(__dirname+'/views',{extension:'pug'}))// loggerapp.use(async(ctx,next)=>{conststart=newDate()awaitnext()constms=newDate()-startconsole.log(`${ctx.method} ${ctx.url} - ${ms}ms`)})// routesapp.use(index.routes(),index.allowedMethods())app.use(users.routes(),users.allowedMethods())// error-handlingapp.on('error',(err,ctx)=>{console.error('server error',err,ctx)});module.exports=app// error handleronerror(app)// middlewaresapp.use(bodyparser({enableTypes:['json','form','text']}))app.use(json())app.use(logger())app.use(require('koa-static')(__dirname+'/public'))app.use(views(__dirname+'/views',{extension:'pug'}))// loggerapp.use(async(ctx,next)=>{conststart=newDate()awaitnext()constms=newDate()-startconsole.log(`${ctx.method} ${ctx.url} - ${ms}ms`)})// routesapp.use(index.routes(),index.allowedMethods())app.use(users.routes(),users.allowedMethods())// error-handlingapp.on('error',(err,ctx)=>{console.error('server error',err,ctx)});module.exports=app

user.js:


constrouter=require('koa-router')()constUser=require('../db/models/user')router.prefix('/users')router.get('/add',function(ctx,next){ctx.body='this is a users/bar response'})router.get('/',function(ctx,next){ctx.body='this is a users response!'})router.get('/bar',function(ctx,next){ctx.body='this is a users/bar response'})module.exports=router

随后重启项目,运行:npm run dev

出现“mogooes 连接成功”的字样代表成功。

实训二

打开projectName文件,在models目录下创建school.js文件,接着文件操作:


constmongoose=require('mongoose')constfeld={name:String,//人物标签where:String,leixing:String}//自动添加更新时间创建时间:letpersonSchema=newmongoose.Schema(feld,{timestamps:{createdAt:'created',updatedAt:'updated'}})module.exports=mongoose.model('School',personSchema)

找到projectName下的routes目录:


constrouter=require('koa-router')()//建立模块,require(“../db/models/文件名”)letModel=require("../db/models/school");router.prefix('/school')router.get('/',function(ctx,next){ctx.body='this is a users response!'})//数据库增删改查router.post('/add',asyncfunction(ctx,next){console.log(ctx.request.body)letmodel=newModel(ctx.request.body);model=awaitmodel.save();console.log('user',model)ctx.body=model})router.post('/find',asyncfunction(ctx,next){letmodels=awaitModel.find({})ctx.body=models})router.post('/get',asyncfunction(ctx,next){// let users = await User.// find({})console.log(ctx.request.body)letmodel=awaitModel.find(ctx.request.body)console.log(model)ctx.body=model})router.post('/update',asyncfunction(ctx,next){console.log(ctx.request.body)letpbj=awaitModel.update({_id:ctx.request.body._id},ctx.request.body);ctx.body=pbj})router.post('/delete',asyncfunction(ctx,next){console.log(ctx.request.body)awaitModel.remove({_id:ctx.request.body._id});ctx.body='shibai '})module.exports=router

在app.js中挂载路由:


constschool=require('./routes/school')app.use(school.routes(),school.allowedMethods())

前台三步骤

打开vue-admin-template-master文件,在src/views目录下创建一个school模块
并在school目录下创建vue文件。

editor.vue为编辑文件,用于创建学校记录






index.vue为目录文件,用于显示结果






在index.js中添加路由:

{
    path: '/school',
    component: Layout,
    meta: { title: '学校管理', icon: 'example' },
    redirect: 'school',
    children: [{
      path: 'school',
      name: 'school',
      component: () => import('@/views/school'),
      meta: { title: '学校管理', icon: 'school' }
    },
      {
        path: 'editor',
        name: 'editor',
        component: () => import('@/views/school/editor'),
        meta: { title: '添加学校', icon: 'school' }
      }]
  },

实训三

后台三步骤:

打开projectName文件,在models目录下创建academy.js文件,接着文件操作:

const mongoose = require('mongoose')
const Schema= mongoose.Schema
const feld={
    name: String,
    //人物标签
    major:String,
    renshu: Number,
    school : { type: Schema.Types.ObjectId, ref: 'School' }
}
//自动添加更新时间创建时间:
let schema = new Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Academy',schema)

找到projectName下的routes目录,创建academy.js文件:

const router = require('koa-router')()
let Model = require("../db/models/academy");
router.prefix('/academy')

router.get('/', function (ctx, next) {
    ctx.body = 'this is a users response!'
})

router.post('/add', async function (ctx, next) {
    console.log(ctx.request.body)
    let model = new Model(ctx.request.body);
    model = await model.save();
    console.log('user',model)
    ctx.body = model
})

router.post('/find', async function (ctx, next) {
    let models = await Model.
    find({}).populate('school')
    ctx.body = models
})

router.post('/get', async function (ctx, next) {
    // let users = await User.
    // find({})
    console.log(ctx.request.body)
    let model = await Model.find(ctx.request.body)
    console.log(model)
    ctx.body = model
})

router.post('/update', async function (ctx, next) {
    console.log(ctx.request.body)
    let pbj = await Model.update({ _id: ctx.request.body._id }, ctx.request.body);
    ctx.body = pbj
})
router.post('/delete', async function (ctx, next) {
    console.log(ctx.request.body)
    await Model.remove({ _id: ctx.request.body._id });
    ctx.body = 'shibai '
})
module.exports = router

在app.js中挂载路由:

const academy = require('./routes/academy')
app.use(academy.routes(), academy.allowedMethods())

前台的三个步骤:

打开vue-admin-template-master文件,在src/views目录下创建一个academy模块并在academy目录下创建vue文件。

editor.vue为编辑文件,用于创建学院记录






index.vue为目录文件,用于显示结果

  



     

在index.js中添加路由:

{
    path: '/academy',
    component: Layout,
    meta: { title: '学院管理', icon: 'example' },
    redirect: 'academy',
    children: [{
      path: 'academy',
      name: 'academy',
      component: () => import('@/views/academy'),
      meta: { title: '学院管理', icon: 'academy' }
    },
      {
        path: 'editor',
        name: 'editor',
        component: () => import('@/views/academy/editor'),
        meta: { title: '添加学院', icon: 'academy' }
      }]
  },

实训四

打开projectName文件,在models目录下创建classs.js文件,接着文件操作:

const mongoose = require('mongoose')
const Schema= mongoose.Schema
const feld={
    name: String,
    //人物标签
    level:String,
    renshu: Number,
    school : { type: Schema.Types.ObjectId, ref: 'School' },
    academy : { type: Schema.Types.ObjectId, ref: 'Academy' }
}
//自动添加更新时间创建时间:
let personSchema = new mongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Classs',personSchema)

找到projectName下的routes目录,创建classs.js文件:

const router = require('koa-router')()
let Model = require("../db/models/classs");
router.prefix('/classs')

router.get('/', function (ctx, next) {
    ctx.body = 'this is a users response!'
})

router.post('/add', async function (ctx, next) {
    console.log(ctx.request.body)
    let model = new Model(ctx.request.body);
    model = await model.save();
    console.log('user',model)
    ctx.body = model
})

router.post('/find', async function (ctx, next) {
    let models = await Model.
    find({}).populate('academy').populate('school')
    ctx.body = models
})


router.post('/get', async function (ctx, next) {
    // let users = await User.
    // find({})
    console.log(ctx.request.body)
    let model = await Model.find(ctx.request.body)
    console.log(model)
    ctx.body = model
})

router.post('/update', async function (ctx, next) {
    console.log(ctx.request.body)
    let pbj = await Model.update({ _id: ctx.request.body._id }, ctx.request.body);
    ctx.body = pbj
})
router.post('/delete', async function (ctx, next) {
    console.log(ctx.request.body)
    await Model.remove({ _id: ctx.request.body._id });
    ctx.body = 'shibai '
})
module.exports = router

在app.js中挂载路由:

const classs= require('./routes/classs')
app.use(classs.routes(), classs.allowedMethods())

前台三步骤:

打开vue-admin-template-master文件,在src/views目录下创建一个classs模块,并在academy目录下创建vue文件。

editor.vue为编辑文件,用于创建班级记录







index.vue为目录文件,用于显示结果;

 




在index.js中添加路由:

{
    path: '/classs',
    component: Layout,
    meta: { title: '班级管理', icon: 'example' },
    redirect: '/classs',
    children: [{
      path: 'classs',
      name: 'classs',
      component: () => import('@/views/classs'),
      meta: { title: '班级管理', icon: 'classs' }
    },
      {
        path: 'editor',
        name: 'editor',
        component: () => import('@/views/classs/editor'),
        meta: { title: '添加班级', icon: 'classs' }
      }]
  },

实训五

后台三步骤:

打开projectName文件,在models目录下创建student.js文件,接着文件操作:

const mongoose = require('mongoose')
const Schema = mongoose.Schema
const feld={
    name: String,
    age: Number,
    student_number:Number,
    gender:String,
    school : { type: Schema.Types.ObjectId, ref: 'School' },
    academy : { type: Schema.Types.ObjectId, ref: 'Academy' },
    classs : { type: Schema.Types.ObjectId, ref: 'Classs' }

}
//自动添加更新时间创建时间:
let personSchema = new mongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Student',personSchema)

找到projectName下的routes目录,创建student.js文件:

const router = require('koa-router')()
let Model = require("../db/models/student");
router.prefix('/student')

router.get('/', function (ctx, next) {
    ctx.body = 'this is a users response!'
})

router.post('/add', async function (ctx, next) {
    console.log(ctx.request.body)
    let model = new Model(ctx.request.body);
    model = await model.save();
    console.log('user',model)
    ctx.body = model
})

router.post('/find', async function (ctx, next) {
    let models = await Model.
    find({}).populate('classs').populate('academy').populate('school')
    ctx.body = models
})

router.post('/get', async function (ctx, next) {
    // let users = await User.
    // find({})
    console.log(ctx.request.body)
    let model = await Model.find(ctx.request.body)
    console.log(model)
    ctx.body = model
})

router.post('/update', async function (ctx, next) {
    console.log(ctx.request.body)
    let pbj = await Model.update({ _id: ctx.request.body._id }, ctx.request.body);
    ctx.body = pbj
})
router.post('/delete', async function (ctx, next) {
    console.log(ctx.request.body)
    await Model.remove({ _id: ctx.request.body._id });
    ctx.body = 'shibai '
})
module.exports = router

在app.js中挂载路由:

const classs= require('./routes/student')
app.use(student.routes(), student.allowedMethods())

前台三步骤:

打开vue-admin-template-master文件,在src/views目录下创建一个student模块,并在student目录下创建vue文件。

editor.vue为编辑文件,用于创建班级记录;






index.vue为目录文件,用于显示结果;






在index.js中添加路由:

 {
    path: '/student',
    component: Layout,
    meta: { title: '学生管理', icon: 'example' },
    redirect: '/student',
    children: [{
      path: 'student',
      name: 'student',
      component: () => import('@/views/student/index'),
      meta: { title: '学生管理', icon: 'user' }
    },
      {
        path: 'editor',
        name: 'editor',
        component: () => import('@/views/student/editor'),
        meta: { title: '添加学生', icon: 'user' }
      }]
  },

实训六

后台三步骤:

打开projectName文件,在models目录下创建teacher.js文件,接着文件操作:

const mongoose = require('mongoose')
const Schema= mongoose.Schema
const feld={
    name: String,
    age: String,
    //人物标签
    level:String,
    gender:String,
    school : { type: Schema.Types.ObjectId, ref: 'School' },
    academy : { type: Schema.Types.ObjectId, ref: 'Academy' }
}
//自动添加更新时间创建时间:
let personSchema = new mongoose.Schema(feld, {timestamps: {createdAt: 'created', updatedAt: 'updated'}})
module.exports= mongoose.model('Teacher',personSchema)

找到projectName下的routes目录,创建teacher.js文件:

const router = require('koa-router')()
let Model = require("../db/models/teacher");
router.prefix('/teacher')

router.get('/', function (ctx, next) {
    ctx.body = 'this is a users response!'
})

router.post('/add', async function (ctx, next) {
    console.log(ctx.request.body)
    let model = new Model(ctx.request.body);
    model = await model.save();
    console.log('user',model)
    ctx.body = model
})

router.post('/find', async function (ctx, next) {
    let models = await Model.
    find({}).populate('academy').populate('school')
    ctx.body = models
})

router.post('/get', async function (ctx, next) {
    // let users = await User.
    // find({})
    console.log(ctx.request.body)
    let model = await Model.find(ctx.request.body)
    console.log(model)
    ctx.body = model
})

router.post('/update', async function (ctx, next) {
    console.log(ctx.request.body)
    let pbj = await Model.update({ _id: ctx.request.body._id }, ctx.request.body);
    ctx.body = pbj
})
router.post('/delete', async function (ctx, next) {
    console.log(ctx.request.body)
    await Model.remove({ _id: ctx.request.body._id });
    ctx.body = 'shibai '
})
module.exports = router

在app.js中挂载路由:

const teacher= require('./routes/teacher')
app.use(teacher.routes(), teacher.allowedMethods())

前台三步骤:

打开vue-admin-template-master文件,在src/views目录下创建一个teacher模块,并在teacher目录下创建vue文件。

editor.vue为编辑文件,用于创建班级记录;







index.vue为目录文件,用于显示结果;







在index.js中添加路由:

  {
    path: '/teacher',
    component: Layout,
    meta: { title: '老师管理', icon: 'example' },
    redirect: '/teacher',
    children: [{
      path: 'teacher',
      name: 'teacher',
      component: () => import('@/views/teacher'),
      meta: { title: '老师管理', icon: 'user' }
    },
      {
        path: 'editor',
        name: 'editor',
        component: () => import('@/views/teacher/editor'),
        meta: { title: '添加老师', icon: 'user' }
      }]
  },

你可能感兴趣的:(董文轩的VUE实训(一)~(六))