node+mysql+vue全栈本地前后端分离mock数据

项目结构：

通过vue-cli创建的vue2.0项目，npm安装axios，body-parser，core-js，element-ui，express，mysql，vue-router。

在项目根目录新建server文件夹，来放node代码。

./server/api.js 

const mysql = require('mysql');
const dbConfig = require('./db');
const sqlMap = require('./sqlMap');

const pool = mysql.createPool({
	host: dbConfig.mysql.host,
	user: dbConfig.mysql.user,
	password: dbConfig.mysql.password,
	database: dbConfig.mysql.database,
	port: dbConfig.mysql.port,
	multipleStatements: true // 多语句查询
});

module.exports = {
	// 获取test数据
	getValue(req, res, next) {
		// let id = req.query.id;
		pool.getConnection((err, connection) => {
			let sql = sqlMap.getValue;
			// connection.query(sql, [id], (err, result) => {
			//     res.json(result);
			//     connection.release();
			// })
			connection.query(sql, (err, result) => {
				if(err){
					console.log(err.message)
   					return;
				}
				res.json(result);
				connection.release();
			})
		})
	},
	// 修改test数据
	setValue(req, res, next) {
		// console.log(req.body);
		let id = req.body.id,
			name = req.body.name;
		pool.getConnection((err, connection) => {
			let sql = sqlMap.setValue;
			connection.query(sql, [name, id], (err, result) => {
				res.json(result);
				connection.release();
			})
		})
	},
	// 新增test数据
	insertValue(req, res, next) {
		let name = req.body.name;
		pool.getConnection((err, connection) => {
			let sql = sqlMap.insertValue;
			connection.query(sql, {name: name}, (err, result) => {
				res.json(result);
				connection.release();
			})
		})
	},
	// 删除test数据
	deleteValue(req, res, next) {
		let id = req.body.id;
		pool.getConnection((err, connection) => {
			let sql = sqlMap.deleteValue;
			connection.query(sql, id, (err, result) => {
				res.json(result);
				connection.release();
			})
		})
	}
}

​

​

./server/db.js   数据库连接配置

// 数据库连接配置
module.exports = {
  mysql: {
    host: 'localhost',  // 新建数据库连接时的 主机名或ID地址 内容
    user: 'root', 
    password: 'root', // root 密码
    database: 'lvjie', // 数据库名
    port: '3306'
  }
}

 ./server/index.js  node入口文件，监听端口，引入各个模块 

const routerApi = require('./router');
const bodyParser = require('body-parser'); // post 数据是需要
const express = require('express');
const app = express();

app.use(bodyParser.json());

// 后端api路由
app.use('/api', routerApi);

// 监听端口
app.listen(9527);
console.log('正在监听9527端口');

 ./server/router.js  node 路由配置，接口地址路由

const express = require('express');
const router = express.Router();
const api = require('./api');

router.get('/getValue', (req, res, next) => {
  api.getValue(req, res, next);
});

router.post('/setValue', (req, res, next) => {
  api.setValue(req, res, next);
});

router.post('/insertValue', (req, res, next) => {
  api.insertValue(req, res, next);
});

router.post('/deleteValue', (req, res, next) => {
  api.deleteValue(req, res, next);
});

module.exports = router;

  ./server/sqlMap.js  数据库操作

var sqlMap = {
  getValue: 'SELECT * FROM test',
  setValue: 'UPDATE test SET name = ? WHERE id = ?',
  insertValue: 'INSERT INTO test SET ?',
  deleteValue: 'DELETE FROM test WHERE id = ?'
}

module.exports = sqlMap;

前端页面代码（请求接口，增删改查）

注意：要下载mysql，开启本地mysql服务（net start mysql）