基于vue2+node+express+mongoDB 获取商量列表查询接口

矫情吗；* 2021-09-15 13:42 222阅读 0赞

一.简单的列子

基于express实现商品列表查询接口

(1).安装mongoose封装

cnpm install mongoose

(2).server文件下创建models ，在models文件下创建表goods.js

//加载mongoose模块
    var mongoose = require('mongoose'); 
    //Schema表模型   获取mongoose的Schema
    var Schema = mongoose.Schema;
    //定义商品模型
    var produtSchema = new Schema({
    	"productId":String,
    	"productName":String,
    	"prodcutPrice":Double,
    	"prodcutImg":String
    });
    //把mongoose的 model中 goods模块暴露出来
    module.exports = mongoose.model('Good',produtSchema);

(3).创建路由(router 文件夹内创建 goods.js)

//1.引入router
    var express = require('express');
    var router = express.Router();
    
    //2.引入mongoose的数据模块
    var mongoose = require('mongoose'); 
    var Goods = require('../models/goods');
    
    //3.连接数据库
    mongoose.connect('mongodb://localhost:27017/shop');
    
    mongoose.connection.on( 'connected', () => {
    	console.log('数据库连接成功！');
    });
    
    mongoose.connection.on( 'error', () => {
    	console.log('数据库连接失败！');
    });
    
    mongoose.connection.on( 'disconnected', () => {
    	console.log('数据库连接断开！');
    });
    
    
    /* GET users listing. */
    //4.路由获取
    router.get('/', function(req, res, next) {
    	//5.查询mongoDB的goods数据  基于mongoose实现商品列表的查询
    	Goods.find({},function(err,doc){
    		if(err){
    			res.json({
    				status:'1',
    				msg:err.message
    			})
    		}else{
    			res.json({
    				status:'0',
    				msg:'',
    				result:{
    					count:doc.length,
    					list:doc
    				}
    			})
    		}
    
    	})
      	// res.send('hello,goods');
    });
    
    //6.暴露路由
    module.exports = router;

(4).入口文件修改app.js

var goodsRouter = require('./routes/goods');
    app.use('/goods', goodsRouter);

![20180612180857852][]

(5).创建MongoDB数据

[MongoDB安装及结合mongobooster可视化工具使用][MongoDB_mongobooster]

注意：上面创建的表字段类型要跟数据库里面的一样

(6).启动项目

1.MongoDB数据要启动

2.node环境也要启动

![20180612181225234][]

(5).浏览器运行：http://localhost:3000/goods

![20180612180102620][]

(5).在vue项目中使用

config/index.js proxyTable 中添加服务器

![20180613094942416][]

api/api.js 请求数据

![20180613094934231][]

在GoodsList.vue中获取数据

![2018061309511294][]

页面渲染成功：

![20180613095118662][]

参考：

[MongoDB安装及结合mongobooster可视化工具使用][MongoDB_mongobooster]

[20180612180857852]: /images/20210813/1cfa583036b3461c9515daf66ef64c03.png
[MongoDB_mongobooster]: https://blog.csdn.net/gao_xu_520/article/details/80642130
[20180612181225234]: /images/20210813/1fc7beba0e074828a5cb272b09c0bcba.png
[20180612180102620]: /images/20210813/43d85c811baa4b1f93e74ff5ab459949.png
[20180613094942416]: /images/20210813/7d2a0f3860bc4c169ff0c10c81ad9447.png
[20180613094934231]: /images/20210813/2d2c3db1560541529984adbc2d4e0414.png
[2018061309511294]: /images/20210813/fbbc1bf793f24867b8d13dbbd9db5add.png
[20180613095118662]: /images/20210813/2b9364ff93af4040bd3a877d2b6bd42a.png