koa 基础(二十六)数据库 与 art-template 模板 联动 --- 编辑数据、删除数据
1.通过 ObjectID 获取 _id
根目录/module/db.js
/**
* DB库
*/
var MongoDB = require('mongodb');
var MongoClient = MongoDB.MongoClient;
var ObjectID = MongoDB.ObjectID;
var Config = require('./config.js'); class Db {
/**
* 单例
* 解决多次实例化,实例不共享的问题
*/
static getInstance() {
if (!Db.instance) {
Db.instance = new Db();
}
return Db.instance;
} constructor() {
this.dbClient = ''; /*属性 存放db对象*/
this.connect(); /*实例化的时候就连接数据库*/
} connect() { /*连接数据库*/
let _that = this;
return new Promise((resolve, reject) => {
if (!_that.dbClient) { /*解决数据库多次连接的问题*/
MongoClient.connect(Config.dbUrl, (err, client) => {
if (err) {
reject(err);
} else {
_that.dbClient = client.db(Config.dbName);
resolve(_that.dbClient);
}
})
} else {
resolve(_that.dbClient);
}
})
} find(collectionName, json) { /*查询数据*/
return new Promise((resolve, reject) => {
this.connect().then((db) => {
var result = db.collection(collectionName).find(json);
result.toArray((err, docs) => {
if (err) {
reject(err);
return;
}
resolve(docs);
})
})
})
} update(collectionName, json1, json2) { /*更新数据*/
return new Promise((resolve, reject) => {
this.connect().then((db) => {
db.collection(collectionName).updateOne(json1, {
$set: json2
}, (err, result) => {
if (err) {
reject(err);
} else {
resolve(result);
}
})
})
})
} insert(collectionName, json) { /*新增数据*/
return new Promise((resolve, reject) => {
this.connect().then((db) => {
db.collection(collectionName).insertOne(json, function (err, result) {
if (err) {
reject(err);
} else {
resolve(result);
}
})
})
})
} remove(collectionName, json) { /*删除数据*/
return new Promise((resolve, reject) => {
this.connect().then((db) => {
db.collection(collectionName).removeOne(json, function (err, result) {
if (err) {
reject(err);
} else {
resolve(result);
}
})
})
})
} getObjectId(id) { /*mongodb里面查询 _id 把字符串转换成对象*/
return new ObjectID(id);
}
} module.exports = Db.getInstance();
2.视图层
根目录/views/index.html
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
.table {
border: 1px solid #eee;
text-align: center;
} .table td,
.table th {
border: 1px solid #eee;
text-align: center;
}
</style>
</head> <body>
<br />
<br />
<a href="/add">增加用户</a>
<br />
<br />
<table class="table">
<tr>
<th>姓名</th>
<th>年龄</th>
<th>性别</th>
<th>操作</th>
</tr>
{{each list}}
<tr>
<td>{{$value.username}}</td>
<td>{{$value.age}}</td>
<td>{{$value.sex}}</td>
<td>
<a href="/edit?id={{@$value._id}}">编辑</a> <a href="/delete?id={{@$value._id}}">删除</a>
</td>
</tr>
{{/each}}
</table>
</body> </html>
根目录/views/edit.html
<!DOCTYPE html>
<html lang="en"> <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head> <body>
<h2>编辑用户</h2>
<form action="/doEdit" method="post">
<input type="hidden" name="id" value="{{@list._id}}" />
<br />用户名:
<input type="text" name="username" value="{{list.username}}" />
<br />
<br /> 年龄:
<input type="text" name="age" value="{{list.age}}" />
<br />
<br /> 性别:
<input type="text" name="sex" value="{{list.sex}}" />
<br />
<br />
<input type="submit" value="提交" />
</form>
</body> </html>
3.控制层
根目录/app.js
// 引入模块
const Koa = require('koa');
const router = require('koa-router')(); /*引入是实例化路由 推荐*/
const render = require('koa-art-template');
const path = require('path');
const BodyParser = require('koa-bodyparser');
const DB = require('./module/db.js'); // 实例化
let app = new Koa(); // 配置post提交数据的中间件
app.use(BodyParser()); // 配置 koa-art-template 模板引擎
render(app, {
root: path.join(__dirname, 'views'), // 视图的位置
extname: '.html', // 后缀名
debug: process.env.NODE_ENV !== 'production' // 是否开启调试模式
}) // 显示学员信息
router.get('/', async (ctx) => {
let result = await DB.find('user', {}); await ctx.render('index', {
list: result
});
}) // 增加学员
router.get('/add', async (ctx) => {
await ctx.render('add');
}) // 执行增加学员的操作
router.post('/doAdd', async (ctx) => {
// 获取表单提交的数据
// console.log(ctx.request.body); // { name: 'aaa', age: 'aa', sex: 'a' }
let data = await DB.insert('user', ctx.request.body);
// console.log(data); try {
if (data.result.ok) {
ctx.redirect('/');
}
} catch (err) {
console.log(err);
ctx.redirect('/add');
}
}) // 编辑学员
router.get('/edit', async (ctx) => {
// 通过 get 传过来的 id 来获取用户信息
let id = ctx.query.id;
// 获取用户信息
let data = await DB.find('user', { "_id": DB.getObjectId(id) });
console.log(data); await ctx.render('edit', {
list: data[0]
});
}) router.post('/doEdit', async (ctx) => {
// 获取用户信息
// console.log(ctx.request.body);
var id = ctx.request.body.id;
var username = ctx.request.body.username;
var age = ctx.request.body.age;
var sex = ctx.request.body.sex; let data = await DB.update('user', { "_id": DB.getObjectId(id) }, {
username, age, sex
}) try {
if (data.result.ok) {
ctx.redirect('/')
}
} catch (err) {
console.log(err);
ctx.redirect('/edit');
}
}) // 删除学员
router.get('/delete', async (ctx) => {
let id = ctx.query.id;
let data = await DB.remove('user', { "_id": DB.getObjectId(id) });
console.log(data); if (data) {
ctx.redirect('/');
}
}) app.use(router.routes());
app.use(router.allowedMethods()); app.listen(3000);
.
koa 基础(二十六)数据库 与 art-template 模板 联动 --- 编辑数据、删除数据的更多相关文章
- Bootstrap <基础二十六>进度条
Bootstrap 进度条.在本教程中,你将看到如何使用 Bootstrap 创建加载.重定向或动作状态的进度条. Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果.Internet ...
- Java进阶专题(二十六) 数据库原理研究与优化
前言 在一个大数据量的系统中,这些数据的存储.处理.搜索是一个非常棘手的问题. 比如存储问题:单台服务器的存储能力及数据处理能力都是有限的, 因此需要增加服务器, 搭建集群来存储海量数据. 读写性能问 ...
- koa 基础(十六)koa 中 session 的使用
1.app.js /** * koa 中 session 的使用 * 1.npm install koa-session --save * 2.const session = require('koa ...
- Bootstrap <基础二十九>面板(Panels)
Bootstrap 面板(Panels).面板组件用于把 DOM 组件插入到一个盒子中.创建一个基本的面板,只需要向 <div> 元素添加 class .panel 和 class .pa ...
- Bootstrap <基础二十八>列表组
列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-group. 向 <li> 添加 cl ...
- Bootstrap <基础二十五>警告(Alerts)
警告(Alerts)以及 Bootstrap 所提供的用于警告的 class.警告(Alerts)向用户提供了一种定义消息样式的方式.它们为典型的用户操作提供了上下文信息反馈. 您可以为警告框添加一个 ...
- Bootstrap<基础二十四> 缩略图
Bootstrap 缩略图.大多数站点都需要在网格中布局图像.视频.文本等.Bootstrap 通过缩略图为此提供了一种简便的方式.使用 Bootstrap 创建缩略图的步骤如下: 在图像周围添加带有 ...
- Bootstrap <基础二十二>超大屏幕(Jumbotron)
Bootstrap 支持的另一个特性,超大屏幕(Jumbotron).顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin).使用超大屏幕(Jumbotron)的步骤如下: ...
- Bootstrap<基础二十> 标签
Bootstrap 标签.标签可用于计数.提示或页面上其他的标记显示.使用 class .label 来显示标签,如下面的实例所示: <!DOCTYPE html> <html> ...
- 二十六. Python基础(26)--类的内置特殊属性和方法
二十六. Python基础(26)--类的内置特殊属性和方法 ● 知识框架 ● 类的内置方法/魔法方法案例1: 单例设计模式 # 类的魔法方法 # 案例1: 单例设计模式 class Teacher: ...
随机推荐
- Linux 永久挂载镜像文件和制作yum源
Linux mount命令是经常会使用到的命令,它用于挂载Linux系统外的文件. 1.镜像挂载到系统指定目录下:[root@master cdrom]# mount -t auto /mnt/c ...
- python之文件 I/O
打印到屏幕 最简单的输出方法是用print语句,你可以给它传递零个或多个用逗号隔开的表达式.此函数把你传递的表达式转换成一个字符串表达式,并将结果写到标准输出如下: >>> prin ...
- vue中优化CheckBox初始状态被选中问题
<template> <div class="hello"> <h2>我是主界面</h2> <!-- <h2>我是 ...
- Nginx----请求分发中心
Nginx请求分发中心,需要明确几个基本问题,什么是请求,分发中心是什么,为什么需要分发中心. 什么是请求? Niginx是一款高性能的HTTP服务器,这里的请求当然是指接收客户端发送的http协议请 ...
- ThreadLocal <T>类的说明 转载 原作者 lujh99
首先,ThreadLocal 不是用来解决共享对象的多线程访问问题的,一般情况下,通过ThreadLocal.set() 到线程中的对象是该线程自己使用的对象,其他线程是不需要访问的,也访问不到的.各 ...
- STM32WB RTC
实时时钟 (RTC) 是一个独立的 BCD 定时器/计数器.RTC 提供一个带可编程闹钟中断的日历时钟以及一个具有中断功能的周期性可编程唤醒标志.RTC 还包含用于管理所有低功耗模式的自动唤醒单元.两 ...
- ListView 一维排布 动态滑动添加新item代码
protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentV ...
- three.js之元素周期表
<html><head> <title>three.js css3d - periodic table</title> <meta charset ...
- zoj 4122 Triangle City 2019山东省赛J题
题目链接 题意: 给出一个无向图,类似三角形的样子,然后给出边的权值,问找一条从第一个点到最后一个点的路径,要求每一条边只能走一次,并且权值和最大,点可以重复走. 思路: 首先观察这个图可以发现,所有 ...
- thinkphp方法success和error跳转时间以及返回ajax
Action类的success和error方法第三个参数为数字时候,表示指定页面跳转时间,例如: $,); $,); 如果是ajax跳转 必须用true: $this->success('操作成 ...