示例 - top250数据库渲染及页面渲染 - 《Linux》

">
1-1 封装
1-2依赖-包
1-3 启动监听
1-4 home页面
1-5 删除
1-6 详情页

1-1 封装

//config-index.js
const Router=require("koa-router");
const requireDir=require("require-directory")
const render=require("koa-art-template")
const path=require("path");
function initProject(app){
    requireDir(module,"../routers",{visit:loadRoutes})
    render(app, {
        root: path.join(process.cwd(), 'pages'),
        extname: '.html',
        debug: process.env.NODE_ENV !== 'production'
      });
    function loadRoutes(obj){
        if(obj instanceof Router){
            app.use(obj.routes())
        }
    }
}
module.exports=initProject;

//modele -index.js
const { MongoClient} = require('mongodb');
// Connection URL
const url = 'mongodb://123.60.82.25:12021';
const client = new MongoClient(url);
const dbName = 'movie';
async function main() {
  await client.connect();
  console.log('Connected successfully to server');
  const db = client.db(dbName);
  const collection = db.collection('top250');
  return collection;
}
module.exports = main;

1-2依赖-包

{
  "name": "1117-login",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "dependencies": {
    "art-template": "^4.13.2",
    "koa": "^2.13.4",
    "koa-art-template": "^1.1.1",
    "koa-body": "^4.2.0",
    "koa-router": "^10.1.1",
    "koa-static": "^5.0.0",
    "mongodb": "^4.1.4",
    "require-directory": "^2.1.1",
    "static": "^2.0.0"
  }
}

1-3 启动监听

//app.js

const koa=require("koa");
const app=new koa();
const initProject=require("./config")
initProject(app);
app.listen(8080);

1-4 home页面

//home.js

const Router=require("koa-router");
const main=require("../models");
const router=new Router();

router.get("/home",async ctx=>{
    var table=await main("top250");
    var movies=await table.find().toArray();
    // console.log(movies);
    await ctx.render("home",{movies})
})
module.exports=router;

//home.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>
    <style>
        .pic{
            width:50px;
        }
    </style>
    <meta name="referrer" content="no-referrer" />
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css"/>
</head>
<body>
    <div class="container">

        <table class="table table-hover">
            <thead>
                <tr>
                    <th>编号</th>
                    <th>_id</th>
                    <th>pic</th>
                    <th>title</th>
                    <th>slogo</th>
                    <th>评价</th>
                    <th>评分</th>
                    <th>是否收藏</th>
                    <th>删除</th>
                </tr>
            </thead>
            <tbody>
                {{each movies}}
                <tr>
                    <td>{{$index+1}}</td>
                    <td>{{@ $value._id}}</td>
                     <td><img class="pic" src="{{@ $value.pic}}" alt=""></td>
                     <td>{{$value.title}}</td>
                     <td><a href="/detail?_id={{@ $value._id}}">{{$value.slogo}}</a></td>
                     <td>{{$value.evaluate}}</td>
                     <td>{{$value.rating}}</td>
                     <td>{{$value.collected}}</td>
                     <td><a href="/doDelete?_id={{@ $value._id}}&title={{$value.title}}" class="btn btn-danger">删除</a></td>
                </tr>
                {{/each}}
            </tbody>
        </table>

    </div>
</body>
</html>

1-5 删除

//doDelete.js


const { ObjectId } = require("bson");
const Router = require("koa-router");
const main=require("../models");
const router=new Router()
router.get("/doDelete",async ctx=>{
    console.log(ctx.query);
    var {_id,title}=ctx.query;
    var table=await main("top250");
    // var res=await table.deleteOne({title:title});
    var res=await table.deleteOne({_id:ObjectId(_id)})
    console.log(res);
    await ctx.redirect("/home")
})
module.exports=router;

1-6 详情页

//detail.js

const { ObjectId } = require("mongodb");
const Router = require("koa-router");
const main = require("../models");
const router = new Router();
router.get("/detail",async ctx=>{
    var {_id} = ctx.query;
    console.log(_id)
    var talbe = await main("top250");
    var result = await talbe.find({_id:ObjectId(_id)}).toArray();
    ctx.body = result
})
module.exports = router;