Node+Vue实现对数据的增删改查_javascript_weixin

这是一个用于学生签到的小例子。主要用到的技术有node和Vue：用node搭建小型服务器，配置好路由，前端用vue写好组件，数据库采用的是mysql。文件结构如下：

主要是功能是对数据的增删改查。由于本人当时对es6语法还不太会，所以刚开始时在从数据库里查数据那一块出了点问题，因为从数据查询数据是异步操作，后来通过从网上找了很多资料，发现用promise可以很好的解决异步问题。

下面是router.js文件里的内容，这是后台配置路由的代码，主要是将对数据的增删改查

const express = require("express");
//定义路由级中间件
const router = express.Router();
//引入数据库连接池，防止数据库超过最大连接数
const query = require("./db");
/*
* 增删改查服务路由
* */
/*新增*/
router.use('/add', function(req, res) {
let userInfo = JSON.parse(req.body.data);
let querysql = "SELECT * FROM userinfo where userName='" + userInfo.userName + "'";
new Promise(function(resolve, reject) {
	query(querysql, null, function(err, rows, fields) {
		if(err) {
			res.json({
				ok: false,
				message: '添加失败！查询',
				error: err
			})
		} else {
			if(rows.length > 0) {
				res.json({
					ok: false,
					message: '添加失败,该用户已经注册了',
					error: err
				})
			} else {
				let addSql = 'INSERT INTO userinfo(userName,major,school,telephone,onlineApply,time,address) VALUES(?,?,?,?,?,?,?)';

				let sqlParams = [
					userInfo.userName, userInfo.major, userInfo.school, userInfo.telephone, userInfo.onlineApply, userInfo.time, userInfo.address
				];
				console.log(userInfo);
				query(addSql, sqlParams, function(err, result) {
					console.log(result);
					console.log(err);
					if(err) {
						res.json({
							ok: false,
							message: '添加失败！'
						})
					} else {
						res.json({
							ok: true,
							id: result.insertId,
							message: '添加成功！'
						})
					}
					res.end();
				})
			}
		}
	})
})
});
/*删除*/
router.use('/delete', function(req, res) {
    let userInfo = JSON.parse(req.body.data);
    let delSql = 'DELETE FROM userinfo where id=' + userInfo.id;
    query(delSql, null, function(err, rows, fields) {
    	if(err) {
    		res.json({
    			ok: false,
    			message: '删除失败！',
    			error: err
    		})
    	} else {
    		res.json({
    			ok: true,
    			message: '删除成功！'
    		})
    	}
    	res.end();
    })
});
/*编辑*/
router.use('/edit', function(req, res) {
    let userInfo = JSON.parse(req.body.data);
    console.log(userInfo);
    let editSql = 'UPDATE userinfo SET userName=?,major=?,school=?,telephone=?,onlineApply=?,time=?WHERE id =' + userInfo.id;
    let editSqlParams = [
    	userInfo.userName,
    	userInfo.major,
    	userInfo.school,
    	userInfo.telephone,
    	userInfo.onlineApply,
    	userInfo.time
    ];
    query(editSql, editSqlParams, function(err, result) {
    	if(err) {
    		res.json({
    			ok: false,
    			message: '修改失败！'
    		})
    	} else {
    		res.json({
    			ok: true,
    			message: '修改成功！'
    		})
    	}
    	res.end();
    })
});
/*查询*/
router.use('/query', function(req, res) {
    let start = 0;
    let end = 100;
    let address =req.body.data;
    let sql = "SELECT * FROM userinfo where address='"+address+"' ORDER BY Id DESC LIMIT " + start + "," + end;
    let countSql = "SELECT COUNT(id) FROM userinfo";
    const promise = new Promise(function(resolve, reject) {
    	query(countSql, null, function(err, rows, fields) {
    		resolve(rows);
    	})
    }).then((count) => {
    	query(sql, null, function(err, rows, fields) {
    		if(err) {
    			res.json({
    				ok: false,
    				message: '查询失败！',
    				info: null
    			})
    		} else {
    			res.json({
    				ok: true,
    				message: '查询成功！',
    				info: rows,
    				total: count[0]["COUNT(id)"]
    			})
    		}
    		res.end();
    	});
    })
});
/*将路由模块输出*/
module.exports = router;   
复制代码

下面是连接数据库的文件(db.js)中的代码

const mysql = require("mysql");
//连接上数据库(连接池)
const pool = mysql.createPool({
  host     : 'localhost',
  user     : 'root',
  password : '123456',
  database:'attendance'
});
/*封装数据库操作方法query--用于增删改查*/
const query=function(sql,sqlParams,callback){
  pool.getConnection(function(err,conn){
    if(err){
      callback(err,null,null);
    }else{
      conn.query(sql,sqlParams,function(qerr,vals,fields){
        //释放连接
        conn.release();
        //事件驱动回调
        callback(qerr,vals,fields);
      });
    }
  });
};
/*模块输出*/
module.exports=query;
复制代码

还有一点需要注意的是因为前后端运行起来时端口不一致，所以存在跨域的问题。因为我们自己在做一些小项目时，处于开发环境，所以直接在前端配置文件中配置代理就可以解决跨域问题，如果是生产环境就需要使用nginx代理跨域了。配置如下所示，3000是node服务器启动后的端口号。

原码地址： github.com/tangjie-93/…