Node JS 06 - CRUD

Node JS 05 - CRUD

Path 模块

  • 将路径解析为一个对象 :

    path.parse('c:/b/c/index.html') {root:'C:/',dir:'C:/b/c',base:'index.html',ext:'.html',name:'index'}

  • 拼接字符串 :

    path.join('c:/','b') 自动拼接路径,和分隔符,需要路径拼接的时候使用

Node 中的其他成员

在每个模块中,除了 require , exports 等模块相关 API 之外, 还有来年各个特殊的成员

  • __dirname 可以用来动态获取当前文件模块所属目录的绝对路径
  • __filename 可以用来动态获取当前文件的绝对路径

在文件操作中, 使用相对路径是不可靠的,因为在 Node 中文件操作的路径被设计为相对于执行 node 命令所处的路径.

为了解决这个问题 ,只需要将相对路径变为绝对路径就可以了.

也就是说可以使用 __filedir`` __fileName帮我们解决问题

CRUD

步骤 :

  • 生成 package.json npm init

  • 环境准备

    • db.json
    {
      "students": [
        {
          "id": 2,
          "name": "lisi",
          "gender": 1,
          "hobbies": "打篮球,LOL"
        },
        {
          "id": 3,
          "name": "lisi",
          "gender": 1,
          "hobbies": "打篮球,LOL"
        }
      ]
    }
    
  • 编写 main.js 文件

    • 创建服务 var express = require('express')
    • 安装 art -template :npm install --save art-template npm install --save express-art-template
    • 配置 art-template : app.engine('art',require('express-art-template'))
    • 安装 body-parser : // 安装 : npm install --save body-parser
    • 配置 body-parser : var bodyParser = require('body-parser') app.use(bodyParser.urlencoded({extended:false})) app.use(bodyParser.json())
    • 配置静态资源 : app.use('/public/',express.static('./public/')) app.use('/node_modules/',express.static('./node_modules/'))
    • 挂载路由 : var router = require('./router') app.use(router)
    • 监听端口 : app.listen(3000,function(){ console.log('server started ...') })
/*
	主模块 :
		1. 创建服务
		2. 做一些服务的相关配置
			2-1. 配置模板引擎
			2-2. 配置 body-parser
			2-3. 提供静态资源服务
		3. 挂载路由
		4. 监听端口
*/
var express = require('express')
var fs = require('fs')
var router = require('./router')
var bodyParser = require('body-parser')

var app = express()

// 配置模板引擎
app.engine('html',require('express-art-template'))

app.use(bodyParser.urlencoded({extended:false}))
app.use(bodyParser.json())

app.use(router)

// 配置静态资源
app.use('/public/',express.static('./public/'))
app.use('/node_modules/',express.static('./node_modules/'))

// 监听端口号
app.listen(3000,function(){
	console.log('server started ...')
})

module.exports = app

  • 编写 router.js
/*
	路由模块 :
	    只用来进行路由的配置
*/
var express = require('express')
var router = express.Router()
var fs = require('fs')
var student = require('./student')

router.get('/student',function(req,res){
	student.find(function(err,data){
		if(err){
			res.status(500).send('Server Error...')
		}
		//console.log(data)
		res.render('index.html',{
			students:data
		})
	})
})

router.get('/',function(req,res){
	student.find(function(err,data){
		if(err){
			res.status(500).send('Server Error...')
		}
		//console.log(data)
		res.render('index.html',{
			students:data
		})
	})
})

router.get('/student/add',function(req,res){
	res.render('add.html')
})

router.post('/student/add',function(req,res){
	var studentBody = req.body
	//console.log(studentBody)
	student.add(studentBody,function(err){
		if(err){
			res.status(500).send('Server Error...')
		}
		res.redirect('/student')
	})
})

router.get('/student/edit',function(req,res){
	var query = req.query
	student.findById(query.id,function(err,data){
		if(err){
			res.status(500).send('Server Error...')
		}
		res.render('edit.html',{
			student:data
		})
	})	
})

router.post('/student/edit',function(req,res){
	var body = req.body
	//console.log(body)
	student.edit(body,function(err){
		if(err){
			res.status(500).send('Server Error...')
		}
		res.redirect('/student')
	})
})

router.get('/student/delete',function(req,res){
	student.deleteById(req.query.id,function(err){
		if(err){
			res.status(500).send('Server Error...')
		}
		res.redirect('/student')
	})
})

module.exports = router

  • 编写 student.js
/*
	学生操作模块
	职责 : 对学生进行增删改查
*/

var fs = require('fs')
var dbPath = './db.json'

/*
*	获取学生列表
*/
exports.find = function (callback) {
	fs.readFile(dbPath,function(err,data){
		if(err){
			return callback(err)
		}
		//console.log(JSON.parse(data.toString()).students)
		callback(null,JSON.parse(data.toString()).students)
	})
}

/*
	根据 id 查询学生信息
*/
exports.findById = function(id,callback){
	// 获取 db 数据
	fs.readFile('./db.json','utf8',function(err,data){
		if(err){
			return callback(err)
		}
		// 格式化为JSON对象
		var students = JSON.parse(data).students
		// 查询出指定 id 的对象
		var student = students.find(function(item){
			// 将 id 转为 number 类型
			return item.id === parseInt(id)
		})
		// 返回
		callback(null,student)
	})
}

/*
	添加学生
*/
exports.add = function(student,callback){
	// 读取数据文件
	fs.readFile('./db.json','utf8',function(err,data){
		if(err){
			return callback(err)
		}
		// 将读取到的数据转为数组
		var students = JSON.parse(data).students
		// 获取最后一个id并加一
		var id = students[students.length-1].id+1
		// 设置到传入的 student 中
		student.id=id
		// 将 student push 到 数组中
		students.push(student)
		// 将数组保存到数据文件中
		var studentsData = JSON.stringify({
			students:students
		})
		fs.writeFile('./db.json',studentsData,function(err){
			if(err){
				return callback(err)
			}
			return callback(null)
		})
	})		
}

/*
	修改学生
*/
exports.edit = function(student,callback){
	// 读取文件内容
	fs.readFile('./db.json','utf8',function(err,data){
		if(err){
			return callback(err)
		}
		// 将内容转为 JSON 数据
		var students = JSON.parse(data).students
		student.id = parseInt(student.id)
		// 找到要修改的学生信息
		var modifyStu = students.find(function(item){
			return item.id === student.id
		})
		//console.log('要修改的学生信息为:'+modifyStu)
		// 进行修改 遍历属性进行修改
		for(var key in student){
			modifyStu[key]  = student[key]
		}
		//console.log('修改后的学生信息为 :'+modifyStu)
		// 将修改后的 JSON 转为字符串
		var studentsData = JSON.stringify({
			students:students
		})
		//console.log('修改后的学生字符串信息为 :'+modifyStu)
		// 写回文件中
		fs.writeFile('./db.json',studentsData,function(err){
			if(err){
				return callback(err)
			}
			return callback(null)
		})
	})
}

/*
	删除学生
*/
exports.deleteById = function(id,callback){
	// 读取文件内容
	fs.readFile(dbPath,function(err,data){
		if(err){
			return callback(err)
		}
		// 转为 JSON 对象
		var students = JSON.parse(data).students
		//遍历 students 找到指定 id 的下标
		var index = students.findIndex(function(item){
			return item.id === parseInt(id)
		})
		//删除指定 index 的对象 
		students.splice(index,1)
		// 将 JSON 对象转为字符串
		var studentsData = JSON.stringify({
			students:students
		})
		// 写回文件中
		fs.writeFile('./db.json',studentsData,function(err){
			if(err){
				return callback(err)
			}
			return callback(null)
		})
	})		
}

find 与 findIndex 原理

var users = [
    {id:1,name:'zhangsan'},
    {id:2,name:'zhangsan'},
    {id:3,name:'zhangsan'}
]
Array.prototype.myFind = function(conditionFunc){
    for (var i = 0; i < this.length; i++){
        if(conditionFunc(this[i],i)){
            //findIndex
            //return i;
            //find
            return this[i]
        }
    }
}
var ret = users.myFind(function(item,index)){
	return item.id === 2                       
}
console.log(ret)
  • 2
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
智慧校园的建设目标是通过数据整合、全面共享,实现校园内教学、科研、管理、服务流程的数字化、信息化、智能化和多媒体化,以提高资源利用率和管理效率,确保校园安全。 智慧校园的建设思路包括构建统一支撑平台、建立完善管理体系、大数据辅助决策和建设校园智慧环境。通过云架构的数据中心与智慧的学习、办公环境,实现日常教学活动、资源建设情况、学业水平情况的全面统计和分析,为决策提供辅助。此外,智慧校园还涵盖了多媒体教学、智慧录播、电子图书馆、VR教室等多种教学模式,以及校园网络、智慧班牌、校园广播等教务管理功能,旨在提升教学品质和管理水平。 智慧校园的详细方案设计进一步细化了教学、教务、安防和运维等多个方面的应用。例如,在智慧教学领域,通过多媒体教学、智慧录播、电子图书馆等技术,实现教学资源的共享和教学模式的创新。在智慧教务方面,校园网络、考场监控、智慧班牌等系统为校园管理提供了便捷和高效。智慧安防系统包括视频监控、一键报警、阳光厨房等,确保校园安全。智慧运维则通过综合管理平台、设备管理、能效管理和资产管理,实现校园设施的智能化管理。 智慧校园的优势和价值体现在个性化互动的智慧教学、协同高效的校园管理、无处不在的校园学习、全面感知的校园环境和轻松便捷的校园生活等方面。通过智慧校园的建设,可以促进教育资源的均衡化,提高教育质量和管理效率,同时保障校园安全和提升师生的学习体验。 总之,智慧校园解决方案通过整合现代信息技术,如云计算、大数据、物联网和人工智能,为教育行业带来了革命性的变革。它不仅提高了教育的质量和效率,还为师生创造了一个更加安全、便捷和富有智慧的学习与生活环境。
您好!感谢您的提问。 关于您的问题,我需要进一步了解您的需求和数据结构。不过,如果您希望在 Vue 中使用 Avue-CRUD 表格显示所有分级,您需要进行以下几个步骤: 1. 安装 Avue-CRUD 插件和其依赖的组件库。 ``` npm install avue-plugin-antd avue-crud --save ``` 2. 引入 Avue-CRUD 组件和其依赖的组件库。 ```javascript import Vue from 'vue' import Antd from 'ant-design-vue' import Avue from 'avue' import AvueCrud from 'avue-crud' import 'ant-design-vue/dist/antd.css' Vue.use(Antd) Vue.use(Avue, { size: 'small', tableSize: 'small' }) Vue.component('avue-crud', AvueCrud) ``` 3. 在 Vue 组件中使用 Avue-CRUD 组件,并配置相关的参数。 ```html <template> <avue-crud :columns="columns" :option="option" /> </template> <script> export default { data() { return { columns: [ { prop: 'id', label: 'ID' }, { prop: 'name', label: '名称' }, { prop: 'level', label: '分级', type: 'tree', options: [] } ], option: { menuAlign: 'center', columnBtn: false, refreshBtn: false, searchBtn: false, collapse: true, treeKey: 'id', treeParentKey: 'parentId', treeLazy: true, tree: { lazy: true, load: this.loadTreeData } } } }, methods: { loadTreeData(node, resolve) { // 异步加载分级数据 } } } </script> ``` 以上是使用 Avue-CRUD 组件显示分级数据的简单示例代码,您需要根据自己的数据结构和业务逻辑进行相应的修改和配置。同时,您也可以参考 Avue-CRUD 官方文档和示例代码进行更详细和深入的学习和使用。 希望能对您有所帮助,如有任何问题,欢迎继续提问!
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值