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

一.简单的列子

基于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);
基于vue2+node+express+mongoDB 获取商量列表查询接口_第1张图片

(5).创建MongoDB数据

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

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

(6).启动项目

1.MongoDB数据要启动

2.node环境也要启动

基于vue2+node+express+mongoDB 获取商量列表查询接口_第2张图片

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

基于vue2+node+express+mongoDB 获取商量列表查询接口_第3张图片

(5).在vue项目中使用

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

基于vue2+node+express+mongoDB 获取商量列表查询接口_第4张图片

api/api.js 请求数据

基于vue2+node+express+mongoDB 获取商量列表查询接口_第5张图片

在GoodsList.vue中获取数据

基于vue2+node+express+mongoDB 获取商量列表查询接口_第6张图片

页面渲染成功:

基于vue2+node+express+mongoDB 获取商量列表查询接口_第7张图片

参考:

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

你可能感兴趣的:(基于vue2+node+express+mongoDB 获取商量列表查询接口)