如何设计一个程序的结构,这是一门专门的学问,叫做"架构模式"(architectural pattern),属于编程的方法论,VC模式就是架构模式的一种。
那什么叫做MVC 呢,其实MVC是 三个单词的简写,
分别是 Model(模型) View(视图) Controller(控制器)
分别解释一下
View视图,很好理解就是直接面向用户的视图层,它是供给用户操作的界面,是程序的外壳
Model模型 是核心的数据层,也是程序需要操作的数据
Controller 控制器层,介于视图和模型之间 负责根据用户从视图层的 输入操作,获取数据层(Model)中的数据,然后对其进行相应的操作->或处理数据库数据或回给用户对应反馈
这三层是紧密联系在一起的,但又是互相独立的,每一层内部的变化不影响其他层。每一层都对外提供接口,供上面一层调用。这样一来,软件就可以实现模块化,修改外观或者变更数据都不用修改其他层,大大方便了维护和升级
下面基于 Express框架 来具体实现 一个 基于 mvc 架构的 小例子
上文提到,模型是 数据层,既然是数据层,就少不了数据库,这里以操作mysql 数据库 为例子
首先 要本机要装mysql 数据库的服务,这里不做过多介绍,大家可以网上查询安装方法
需要下载的插件
mysql2 数据库支持
sequelize 操作mysql的ORM框架
async 异步处理方法库
npm i mysql2
npm i sequelize
npm i async
创建 User数据库
创建 user 数据表
添加模拟数据
为了便于其他文件引用数据库对象,将数据库对象实例化放在一个单独的文件里,跟目录下创建 database目录,并在database目录下创建index.js文件 写入如下配置
var Sequelize = require('sequelize')
var Config = require('../config.js')
// 实例化数据库对象
var sequelize = new Sequelize(
'user',
'root',
'12345678',{
host: 'localhost',
// 数据库类型
dialect: 'mysql',
// 是否打印日志
logging: true,
pool:{
max: 5,
min:0,
idle: 10000
},
// 禁用所有时间戳开启
define: {
timestamps: false
},
// 市区设置
timezone: '+08:00'
}
)
module.exports = sequelize
对象关系映射(Object Relational Mapping,简称ORM)模式是一种为了解决面向对象与关系数据库存在的互不匹配的现象的技术。简单的说,ORM是通过使用描述对象和数据库之间映射 的元数据,将程序中的对象自动持久化到关系数据库中
安装完后数据库支持并增加了数据库配置文件后,需要定义model 根目录下创建models目录,并在models目录下创建user.js文件 内容如下
const Sequelize = require('sequelize')
const db = require('../database/index.js')
// 定义model
const User = db.define('user', {
// primaryKey:是否为主键 allowNull是否允许为空 autoIncrement 是否 自增
id: {type: Sequelize.INTEGER, primaryKey: true, allowNull: false,autoIncrement:true},
name: {type: Sequelize.STRING(20), allowNull: true},
age: {type: Sequelize.INTEGER(2), allowNull: true},
})
module.exports = User
至此 model层 完成
视图层 上一下篇文章具体写过,详情请看 Express-视图模版
views目录下新建index.html
内容如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
{{each list as item}}
<p>数字:{{item.id}} 名字: {{item.name}} 年龄:{{item.age }}</p>
{{/each}}
</body>
</html>
最关键的部分来了,上面说道,Controller层是视图和模型之间的桥梁
下面开始 Controller层的 创建
首先创建个常量配置 根目录下 新建constant 目录 并在此目录下 创建status.js 内容如下
const status = {
SUCCESS: {
code:200,
msg:'成功'
},
ERROR:{
code: 500,
msg: '出现错误'
},
LACK:{
code:403,
msg:'缺少参数'
}
}
module.exports = status
根目录下创建 controller目录 并在controller目录下创建 user.js 控制器
具体内容如下
const async = require('async')
const UserModel = require('../models/user')
const Constant = require('../constant/status')
let exportObj = {
getList
}
// 获取用户列表
function getList (req,res,next){
let task = {
query: cb => {
// 使用 sequelize的model 的findAll 方法查询数据
UserModel.findAll({limit:10}).then((result) => {
// 处理数据获取想要的字段
cb(null,result.map(res => {
return {
id:res.id,
name:res.name,
age:res.age
}
}))
}).catch((err) => {
console.log(err)
cb(Constant.ERROR)
})
}
}
async.auto(task, (err, result) => {
if(err){
console.log(err)
}
console.log(result['query'])
// 输出数据到视图
res.render('index', {list:result['query']})
})
}
module.exports = exportObj
引入控制器,绑定路由器地址
const user = require('../controllers/user')
router.get('/user', user.getList)
最终效果如下
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。
原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。
如有侵权,请联系 cloudcommunity@tencent.com 删除。