本文把前后台一起串起来,前端使用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. spss分析存在共性线后,接下来是怎么分析?

    在进行线性回归分析时,容易出现自变量(解释变量)之间彼此相关,这种情况被称作多重共线性问题. 适度的多重共线性不成问题,但当出现严重共线性问题时,可能导致分析结果不稳定,出现回归系数的符号与实际情况完 ...

  2. iOS Autoresizing Autolayout Size classes

    Autoresizing:出现最早,仅仅能够针对父控件做约束(注意:要关闭Autolayout&Size classes才能够看到Autoresizing) 代码对应: UIView.h中的a ...

  3. CodeForces-714B-Filya and Homework+思路

    Filya and Homework 题意: 给定一串数字,任选一个数a,把若干个数加上a,把若干个数减去a,能否使得数列全部相同: 思路: 我开始就想找出平均数,以为只有和偶数的可以,结果wa在 1 ...

  4. 2019 Multi-University Training Contest 4

    A. AND Minimum Spanning Tree solved by rdc 21min -1 数组开小了,解体了一次. 题意 给一棵树,两点之间边权为 x & y,求最小生成树. 做 ...

  5. CF 435B Little Pony and Harmony Chest

    Little Pony and Harmony Chest 题解: 因为 1 <= ai <= 30 所以  1 <= bi <= 58, 因为 59 和 1 等效, 所以不需 ...

  6. hdu 1301 Jungle Roads krusckal,最小生成树,并查集

    The Head Elder of the tropical island of Lagrishan has a problem. A burst of foreign aid money was s ...

  7. C#基础——事件初步

    事件是C#语言的重要成员之一,初学者往往不能很好的去理解和运用事件,特别是自定义事件.在这里将以较简单的方式呈现事件最基本的用法. 1.事件的定义 给事件下定义是一个较困难的事,因为它体现的是对象与对 ...

  8. MyBatis的发展和选型

    xlecho编辑整理,欢迎转载,转载请声明文章来源.欢迎添加echo微信(微信号:t2421499075)交流学习. 百战不败,依不自称常胜,百败不颓,依能奋力前行.--这才是真正的堪称强大!! 参考 ...

  9. HTTPS加密协议

    使用JDK自带的keytool工具生成一个证书(keystore文件),其中包含了密钥. a.在命令行输入以下命令:keytool -genkey -alias tbb -keyalg RSA -ke ...

  10. 本地代码上传至github

    一. 环境及工具 1.下载并安装git版本管理工具 到 http://git-scm.com/downloads 下载并安装git版本管理工具 2.Windows客户端 3.配置github账号密码及 ...