vue + vue-router +axios + element UI + PHP + CodeIgniter + Mysql 项目管理系统

技术选型：

前端技术栈：vue + vue-router +axios + element UI

后端技术栈：PHP 7.0 + CodeIgniter3.0

数据库：Mysql5.7

服务器：Apache

遇到的问题：

1、vue 项目搭建到 Apache 时，当浏览器刷新，可能会出现访问不到，报404

解决方法：项目打包完成（npm run build）后在其根目录下创建文件.htaccess并添加下面代码即可解决。

<IfModule mod_rewrite.c>RewriteEngine OnRewriteBase /RewriteRule ^index\.html$ - [L]RewriteCond %{REQUEST_FILENAME} !-fRewriteCond %{REQUEST_FILENAME} !-dRewriteRule . /index.html [L]
</IfModule>

2、前后进行接口联通时出现了跨域的问题，可以在后台设置允许跨域。

解决方法：在每个自定义类的顶部配置好一下参数即可实现跨域

header('Content-Type: application/json;charset=utf-8');
header('Access-Control-Allow-Origin:*'); // *代表允许任何网址请求
header('Access-Control-Allow-Methods:POST,GET,OPTIONS,DELETE'); // 允许请求的类型
header('Access-Control-Allow-Credentials: true'); // 设置是否允许发送 cookies
header('Access-Control-Allow-Headers: Content-Type,Content-Length,Accept-Encoding,X-Requested-with, Origin'); // 设置允许自定义请求头的字段

3、如何使用CodeIgniter搭建项目

解决方法：下载 CodeIgniter，只拷贝CodeIgniter 中的application、system文件夹及index.php到项目根路径即可。

4、使用CodeIgniter搭建后台服务，在访问时要在域名或 IP 地址前添加 index.php

解决方法：在后端根目录下创建文件.htaccess，并添加以下代码即可解决

 <IfModule mod_rewrite.c>RewriteEngine onRewriteCond %{REQUEST_FILENAME} !-dRewriteCond %{REQUEST_FILENAME} !-fRewriteRule ^(.*)$ index.php/$1 [QSA,PT,L]</IfModule>

5、如何下载数据库，并在项目中连接数据库

解决方法：下载 wampServer，该软件集成了Mysql 和 Apache 。修改项目中的 application/config/database.php

$db['default'] = array('hostname' => 'localhost','username' => '','password' => '','database' => '','dbdriver' => 'mysqli'
)

项目效果图（部分）：

下载地址

vue + vue-router +axios + element UI + PHP + CodeIgniter + Mysql 项目管理系统相关推荐

axios vue 加载效果动画_vue+axios+element ui 实现全局loading加载示例
实现全局loading加载分析需求,我们只需要在请求发起的时候开始loading,响应结束的时候关闭loading,就这么简单对不对? import axios from 'axios'; imp ...
【前端】Vue+Element UI案例：通用后台管理系统-登陆不同用户显示不同菜单、动态添加路由
文章目录目标代码 0.动态地显示菜单:store 1.动态注册路由 2.解决刷新后摆平问题总代码本篇修改的代码文件 tab.js 参考视频: VUE项目,VUE项目实战,vue后台管理系统,前 ...
【前端】Vue+Element UI案例：通用后台管理系统-代码总结（已开源）
文章目录前言项目文件目录 api mockServe home.js permission.js index.js mock.js user.js assert components Common ...
【前端】Vue+Element UI案例：通用后台管理系统-用户管理：Table表格增删查改、Pagination分页、搜索框
文章目录目标代码 0.结构 1.按钮-删除 2.按钮-编辑 3.debug 4.样式 5.分页Pagination:功能 6.分页Pagination:样式 7.搜索框:功能 8.搜索框:样式总 ...
【前端】Vue+Element UI案例：通用后台管理系统-用户管理：Form表单填写、Dialog对话框弹出
文章目录目标代码 0.页面结构 1.新增按钮和弹出表单:结构 2.新增按钮和弹出表单:点击新增弹出表单 3.表单样式 4.表单验证 5.表单的提交和取消功能:接口.mock相关准备 6.表单的提交 ...
vue学习笔记-关于element ui 安装失败的问题解决
今天学习vue时,对element ui进行安装,运行npm install element-ui -S 命令,出现报错: npm ERR! code ERESOLVE npm ERR! ERESOL ...
vue安装并导入Element UI
首先,在Vue项目的终端输入:npm i element-ui -S (输入之后,回车,等待一会儿,就会出现下图红框以下的内容,表示已经安装成功) 然后,在main.js中添加: import Ele ...
vue 3.0记录Element UI 表单使用(看了隔壁小孩儿都会用的Element UI 表单组件使用)
Element UI 表单使用记录 element ui 表单 input 文本域日期选择中国标准时间与xxxx-xx-xx格式时间之间的来回切换中国标准时间转换为xxxx-xx-xx格式 ...
vue加载动画element ui V-loading属性踩坑记录
根据需求,由预览按钮打开弹窗,且弹窗需要渲染的数据较多,渲染的速度比较慢,所以要加一个加载中的效果,element ui的 v-loading属性就正好可以解决这一需求,但是当加入这一属性之后发现,是 ...
vue问题三：element ui的upload组件上传图片成功和移除事件
element ui的upload组件上传图片成功和移除事件: 登录后获取到后台传的token存到中: sessionStorage.setItem("token",data.ob ...

vue + vue-router +axios + element UI + PHP + CodeIgniter + Mysql 项目管理系统

vue + vue-router +axios + element UI + PHP + CodeIgniter + Mysql 项目管理系统相关推荐

最新文章

热门文章