本文把前后台一起串起来,前端使用vue-cli后台用nodejs连接数据库,vue-cli请求接口其数据是来自于mysql数据。
一、vue-cli请求接口部分
<template>
  <div id="app">
    <img src="./assets/logo.png">
    <router-view/>
  </div>
</template>

<script>
export default {
  name: 'App',
  mounted(){

    this.axios.get("api/list").then((res)=>{
      console.log(res.data[0]);
    })
  }
}
</script>
接口部分当然要设置代理了。设置代理连接:https://www.3mooc.com/front/articleinfo/441
二、nodejs连接数据部分
express-generator
1. 全局安装
npm install express-generator -g 
2. express --view=ejs 项目名称
例如: express --view=ejs server
3. npm install mysql
var mysql      = require('mysql');
var connection = mysql.createConnection({
  host     : 'localhost',
  user     : 'root',
  password : 'rootroot',
  database : 'demo'
});

module.exports = connection;

  

var express = require('express');
var router = express.Router();
var connection = require('../db/sql.js');
/* GET home page. */
router.get('/', function(req, res, next) {
  res.render('index', { title: 'Express' });
});

router.get('/list', function(req, res, next) {
 	connection.query("select * from user",function(error, results, fields){
 		res.json(results);
 	})
});

module.exports = router;
每日分享文章-附带视频教程:https://www.3mooc.com/front/couinfo/1002

Vue-cli连接mysql的更多相关文章

  1. vue项目中连接MySQL时,报错ER_ACCESS_DENIED_ERROR: Access denied for user 'root'@'localhost' (using password:YES)

    一.前言 我们前端很多时候在写vue项目的时候,会把后端的数据拿到本地来跑,在连接MySQL数据库的时候,可能出现一些问题,如: ER_ACCESS_DENIED_ERROR: Access deni ...

  2. PHP连接MySql闪断自动重连的方法

    使用php作为后台运行程序(例如短信群发),在cli模式下执行php,php需要连接mysql循环执行数据库处理. 当mysql连接闪断时,之后循环的执行将会失败. 我们需要设计一个方法,当mysql ...

  3. hive连接MySQL报错

    错误如下: [root@awen01 /usr/local/apache-hive-1.2.1-bin]#./bin/hive Logging initialized using configurat ...

  4. Vue CLI 3.x 简单体验

    文档 中文文档 补充于02月10日 vue脚手架的3.x版本已经在开发中,现在还处于alpha版本.我们来看看有哪些变化. 使用 npm install -g @vue/cli 命名方式已经改为npm ...

  5. php 连接mysql 主机 localhost,显示 No such file or directory

    打开 php.ini文件,找到这1行 mysql.default_socket 然后将它修改为 mysql.default_socket=/path/to/mysql.sock /path/to/my ...

  6. vscode下搭建vue.js开发环境(基于最新的@Vue/cli 4.2.2)

    2020-02-13. 网上的那些怎么安装vue环境的2.x就不要再看了,都过时了,现在去官网下载,按照他们的设置各种问题.接下来看下最新的安装方法. 前四步是一样的: 1.下载并安装vscode 2 ...

  7. 13. Vue CLI脚手架

    一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...

  8. 改造@vue/cli项目为服务端渲染-ServerSideRender

    VUE SEO方案二 - SSR服务端渲染 在上一章中,我们分享了预渲染的方案来解决SEO问题,个人还是很中意此方案的,既简单又能解决大部分问题.但是也有着一定的缺陷,所以我们继续来看下一个方案--服 ...

  9. nodejs进阶(6)—连接MySQL数据库

    1. 建库连库 连接MySQL数据库需要安装支持 npm install mysql 我们需要提前安装按mysql sever端 建一个数据库mydb1 mysql> CREATE DATABA ...

  10. 【初学python】使用python连接mysql数据查询结果并显示

    因为测试工作经常需要与后台数据库进行数据比较和统计,所以采用python编写连接数据库脚本方便测试,提高工作效率,脚本如下(python连接mysql需要引入第三方库MySQLdb,百度下载安装) # ...

随机推荐

  1. hdu-6701 Make Rounddog Happy

    题目链接 Make Rounddog Happy Problem Description Rounddog always has an array a1,a2,⋯,an in his right po ...

  2. P2157 [SDOI2009]学校食堂 状压DP

    题意: 排队买饭,时间为前一个人和后一个人的异或和,每个人允许其后面B[i] 个人先买到饭,问最少的总用时. 思路: 用dp[i][j][k] 表示1-i-1已经买好饭了,第i个人后面买饭情况为j,最 ...

  3. Aizu-2249 Road Construction(dijkstra求最短路)

    Aizu - 2249 题意:国王本来有一个铺路计划,后来发现太贵了,决定删除计划中的某些边,但是有2个原则,1:所有的城市必须能达到. 2:城市与首都(1号城市)之间的最小距离不能变大. 并且在这2 ...

  4. lightoj 1046 - Rider(bfs)

    A rider is a fantasy chess piece that can jump like a knight several times in a single move. A rider ...

  5. Atcoder D - A or...or B Problem(思维)

    题目链接:http://agc015.contest.atcoder.jp/tasks/agc015_d 题意:给出两个数b,a(a>=b)问{a,a+1,....,b}的集合内取任意数求或运算 ...

  6. hdu 4734 F(x)(数位dp+优化)

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4734 题意:我们定义十进制数x的权值为f(x) = a(n)*2^(n-1)+a(n-1)*2(n-2 ...

  7. 淘淘购物系统 (Python)

    #首页def tao_first(): t1 = '欢迎进入淘淘购物'.center(110) print(t1) print('~' * 130) t2 = '注册'.center(20) prin ...

  8. 用mmap做I/O

     1.   Introduction   mmap是Linux中一个相对复杂的函数,仅函数的参数就有6个.但是他也是一个十分强大的函数,在文件I/O,进程间通信,和malloc函数的实现中皆有他的身影 ...

  9. Webstorm 的设置

    背景色

  10. 【Offer】[28] 【对称的二叉树】

    题目描述 思路分析 测试用例 Java代码 代码链接 题目描述 请实现一个函数,用来判断一-棵二叉树是不是对称的.如果一棵二叉树和它的镜像一样,那么它是对称的.  牛客网刷题地址 思路分析 利用前序 ...