Vue项目通过node连接MySQL数据库并实现增删改查操作

Vue项目通过node连接MySQL数据库

1.创建Vue项目

vue create 项目名

Vue项目创建的详细步骤，有需要的可移步这里

2.下载安装需要的插件

• 下载express

  npm install express

• 下载cors，用于处理接口跨域问题

  npm install cors

• 下载mysql

  npm install mysql

• 下载axios

  npm install axios

3.在项目中创建server文件夹，用于搭建本地服务器

• 新建/server/app.js，用于配置服务器相关信息

  let express = require(‘express’)
  let app = express()
  let cors = require(‘cors’)
  let bodyParser = require(‘body-parser’)

  app.use(bodyParser.json()); //配置解析，用于解析json和urlencoded格式的数据
  app.use(bodyParser.urlencoded({extended: false}));
  app.use(cors()) //配置跨域，必须在路由之前

  app.listen(80, () => {
  console.log(‘服务器启动成功’);
  })

• 新建/server/db/index.js，用于配置数据库相关信息

  let mysql = require(‘mysql’)

  let db = mysql.createPool({
  host: ‘127.0.0.1’, //数据库IP地址
  user: ‘root’, //数据库登录账号
  password: ‘root’, //数据库登录密码
  database: ‘test’ //要操作的数据库
  })

  module.exports = db

• 新建/server/API/user.js，用于操作数据库

  let db = require(‘…/db/index’)

  exports.get = (req, res) => {
  var sql = ‘select * from user’
  db.query(sql, (err, data) => {
  if(err) {
  return res.send(‘错误：’ + err.message)
  }
  res.send(data)
  })
  }

• 新建/server/router.js，用于配置对应路由

  let express = require(‘express’)
  let router = express.Router()
  let user = require(‘./API/user’)