Vue+Express+MySQL

vue前端+express后端搭建

Vue开发环境 + Express后端服务实现前后端分离

vue组件嵌套

子模块lab.vue

父模块app.vue

get获取页面

1.前端：views文件夹创建researcher.vue文件

axios向后端发送get请求

2. 前端：router文件夹下index.js

添加路径，将组件的请求进行路由转发

index.js的作用

3. 后端：routes文件夹创建get.js文件

接收前端请求，执行sql语句进行响应

  '/lab'  指的是 /get后面添加的东西

4. 后端：app.js中添加route

app.use ('/get',...) 其实就是相当于 localhost:3000/get

组件通信

1. lab.vue点击按钮

2. lab.vue发送数据

3. secretary监听数据

post请求req.body为undefined或者获取不到值

在app.js中加入

解决node.js+MYSQL读/写date类型数据有异样

在数据库中date类型数据原本为:2021-05-05，但是直接打印出来是：

date:2021-05-04T16:00:00.000Z

这是数据库服务器的时区与本地不同，因此需要手动设定时区为东八区，在进行mysql连接时，如下操作即可解决：

    // 连接mysql配置信息
    const conn = mysql.createConnection({
      host: 'localhost',
      user: 'root',
      password: '123456',
      database: 'testdb',
      timezone: '08:00'// 设置时区为东八区，让date数据正常显示
    })

解决函数获取不到this.data数据

原因：在Vue自定义指令中，this指向的是指令对象（Directive Object），而不是Vue实例（Vue Instance）

解决：使用箭头函数。箭头函数的this指向是固定的，在箭头函数中，无论this在哪里调用，它都指向箭头函数外层包裹函数的this