Vue.js连接阿里云MYSQL获取数据并渲染

Vue.js连接阿里云MYSQL获取数据并渲染

以下操作如有不详细的可以评论说明。

阿里云服务器连接MYSQL参考文档地址:https://blog.csdn.net/qq_34227291/article/details/90047596

PS:以下示例是在vue.js环境下实现,打包上传至站点。

相关知识点:vue.js/打包、php、ECS服务器、DM自建数据库、Xftp

1. 登陆数据库并新建数据库和导入表,作为测试的渲染数据。
Vue.js连接阿里云MYSQL获取数据并渲染

2. vue文件
PS:26行代码get()里面的文件路径后面会说到
Vue.js连接阿里云MYSQL获取数据并渲染
3. php
文件1:
Vue.js连接阿里云MYSQL获取数据并渲染
文件2:
Vue.js连接阿里云MYSQL获取数据并渲染
4. 打包
运行:npm run build命令
Vue.js连接阿里云MYSQL获取数据并渲染
5. 上传站点
PS:步骤1使用到的get()方式获取数据的路径便是下面的文件/路径
Php目录存放php文件
Static目录是存放css、js
Vue.js连接阿里云MYSQL获取数据并渲染
Vue.js连接阿里云MYSQL获取数据并渲染
6. 测试结果成功
Vue.js连接阿里云MYSQL获取数据并渲染