手把手教你用express + mysql + knex 做个 todoList

最新推荐文章于 2024-03-13 09:10:35 发布

十方魔

最新推荐文章于 2024-03-13 09:10:35 发布

阅读量4.2k

点赞数 1

分类专栏：后端/node.js 前端框架/Vue 文章标签： express mysql knex nodejs 全栈

本文链接：https://blog.csdn.net/github_36487770/article/details/80406834

版权

本文手把手教你如何利用Express、MySQL和Knex构建一个TodoList应用。从启动MySQL服务，建立数据库连接，到设计API接口（包括创建任务、查询任务、删除任务、修改任务状态），再到前端展示部分，使用Vue和Bootstrap实现任务的显示和交互。最后，文章还分享了一些项目完成后的感想。

摘要由CSDN通过智能技术生成

成果展示
启动mysql，用knex连接数据
接口功能拆分
前端展示：vue+bootstrap
All Done：一点想法

成果展示

项目源代码地址见git，在routes下找todolist
这里写图片描述

启动mysql，用knex连接数据

终端运行

mysql.server start

看到“starting mysql SUCCESS!”，把服务启动起来后，再新开一个终端窗口，用root登录

mysql -u root  //  显示welcome to the MySQL monitor
show databases   
use example   //例子中用到了example这个database

knex是一个npm包，用于node.js下连接mysql。

连接mysql

var knex = require('knex')({
    client:'mysql',
    connection:{
        host:'localhost',
        user: 'root',
        password: '',
        database: 'example'
    }
})

接口功能拆分

建表：创建任务列表

function createToDoList() {
    return 
    knex.schema
    .hasTable('todolist')
    .then( ifExist => {
        if(!ifExist){
            return knex.schema.createTable('todolist', (table) =>{
                table.increments('task_id').primary()
                table.string('task_name').notNullable()
                table.integer('task_status').notNullable().defaultTo(0)
                table.dateTime('task_start_date')
                table.dateTime('task_end_date')
            })
        }
    })  
    .catch( err => {
        console.log('error !!!', err.message, err.stack)
        return
    })
}

查询任务列表

状态分为0（未完成）和1（已经完成），分别保存在两个数组里。

async function getTasks(){
    var toDoTasks = await knex('todolist').select().where('task_status', 0)
    var finishedTasks = await knex('todolist').