NODE后端处理数据ejs 渲染到页面（小白的笔记）

前一阵学过前端渲染和后端渲染没几天就忘没了今天来复习一下后端渲染记个笔记

1.安装

首先需要express模块，fs模块，ejs模块

npm install ejs --save

2. .ejs文件

这里和.html一样所以我只粘了body里面的代码

<% 内容是表达式 %>
<%= 内容是值 %>

<body>
        <h1>小垃圾的通讯录</h1>
        <div>
            <ul>
                <!-- <% 内容是表达式 %> <%=  内容是变量 %> -->
                <%data.forEach(e=>{%>
                <li>
                    <span>
                        <%= e.name %>
                    </span>
                    <span>
                        <%= e.phoneNum %>
                    </span>
                </li>
                <%})%>
            </ul>
        </div>
    </body>

index.js文件

const express = require('express')
const app = express()
const fs = require('fs')
const ejs = require('ejs')
const MongoData = require('./MongoData')
     
app.listen(3000)

var numData = new MongoData('callBook', 'callBook')
app.use(express.static('./static/tongxunlu.html'))
app.get('/', (req, res) => {
    numData.find({}, (err, result) => {
        if (err) {
            console.log(err)
        }
        ejs.renderFile('./static/index.ejs',{data : result},(err,str)=>{
            if(err) {
                console.log(err)
                return
            } 
            res.send(str)
        })
    })
})

index.js文件里引入的MongoData文件

const mongodb = require('mongodb')
const { MongoClient, ObjectId } = mongodb

//存储数据 MongoData('callBook','callBook') 
// 存储错误 ('dbErr', 'errData')

//接口 连接数据库 实现相应功能、
class DealData {
    constructor(dbname, collectionname) {
        var dbName = dbname
        var collectionName = collectionname
        this.insert = (data, callBack) => {
            MongoClient.connect('mongodb://127.0.0.1:27017', { useNewUrlParser: true }, (err, client) => {
                if (err) {
                    this.dealErr(err, callBack)
                }
                var dataP = client.db(dbName).collection(collectionName)
                dataP.insert(data, (err, result) => {
                    if (err) {
                        this.dealErr(err, callBack)
                    }
                    callBack(null, result)
                    client.close()
                }) 
            })
        }
        this.delete = (data, callBack) => {
            MongoClient.connect('mongodb://127.0.0.1:27017', { useNewUrlParser: true }, (err, client) => {
                if (err) {
                    this.dealErr(err, callBack)
                }
                var dataP = client.db(dbName).collection(collectionName)
                dataP.deleteOne(data, (err, result) => {
                    if (err) {
                        this.dealErr(err, callBack)
                    }
                    callBack(null, result)
                    client.close()
                })
            })
        }
        this.updata = (data, newData, callBack) => {
            MongoClient.connect('mongodb://127.0.0.1:27017', { useNewUrlParser: true }, (err, client) => {
                if (err) {
                    this.dealErr(err, callBack)
                }
                var dataP = client.db(dbName).collection(collectionName)
                dataP.updateOne(data, { $set: newData }, (err, result) => {
                    if (err) {
                        this.dealErr(err, callBack)
                    }
                    callBack(null, result)
                    client.close()
                })
            })
        }
        this.find = (data, callBack) => {
            MongoClient.connect('mongodb://127.0.0.1:27017', { useNewUrlParser: true }, (err, client) => {
                if (err) {
                    this.dealErr(err, callBack)
                }
                var dataP = client.db(dbName).collection(collectionName)
                dataP.find(data).toArray((err, result) => {
                    if (err) {
                        this.dealErr(err, callBack)
                    }
                    callBack(null, result)
                    client.close()
                })
            })
        }
        this.dealErr = (err, callBack) => {
            var errDB = new DealData('dbErr', 'errData')
            errDB.insert(err)
            callBack(err,null)
        }
    }
}
module.exports = DealData

最后结果就这样~~

在这里插入图片描述

这里小白一枚，在成为码农的道路上爬行ing~~

NODE后端处理数据ejs 渲染到页面（小白的笔记）

1.安装

2. .ejs文件

index.js文件

最后结果就这样~~

猜你喜欢