Laravel框架下的Todos项目

laravel框架下的Todos项目

需要工具：phpStrom和laragon

一、工程创建

输入项目名称后，在命令行创建工程时，改变composer镜像地址：

1. Ctrl+C中断创建

2. 打开Laragon的终端键入如下指令composer config -g repo.packagist Composer
   https://mirrors.aliyun.com/composer/

3. 重新加载Apache

4. 通过下图方式快速访问

使用phpStrom打开工程目录

二、Laravel中的视图、控制器和模型

Laravel是一个符合MVC模式的框架。MVC即将应用拆分为模型、控制器和视图三个层次
（Model、Controller and View），三个层次各司其职，相互配合使功能模块的实现
结构清晰，便于开发和维护。

（1）视图层：展示界面和模型层数据。

Laravel的视图层代码放在resources下

①视图页面存放于resources/views

（刚建立完工程时只有welcome.blade.php文件）

②视图的样式放于resources/sass

③视图文件是.blade.php,即支持laravel blade模板
语法的php文件。blade模板语法参看文档https://laravel.com/docs/7.x/blade

④在resources/views目录下创建about.blade.php

⑤在routes/web.php中添加路由（路由定义了WEB应用中各种页面/API请求的入口），通过Get请求，
在about路径下能获取到about页面。

（2）控制层：操作视图和模型层，控制数据在视图 和模型层之间流动。

①Laravel的控制器层代码放在app/Http/Controller中

②创建控制器可利用artisan工具（它是laravel提供的命令行

工具），执行命令： php artisan make:Controller <控制器类名>

③利用artisan工具创建AboutController控制器

• 在laragon打开终端，使用cd进入项目Todos

• 输入命令php artisan make:Controller AboutController

④在控制器中定义index方法返回about页面

⑤在web.php用AboutController的index方法替代 /about路由中的处理函数

（3）模型层：代表一个存取数据的对象。

①Laravel的模型层代码放在app/中

②创建模型可利用artisan工具，执行命令：php artisan make:Model <模型类名>

③在.env中设置数据库连接配置

数据库名和数据库密码根据自己的写

④利用migrate创建数据库迁徙文件

• 迁徙文件位于database/migrations目录中

• 创建迁徙文件可用命令： php artisan make:migration <迁徙文件名称>

• 迁徙文件中创建表字段

• 执行数据库迁徙

• 在laragon打开终端，cd进入工程目录，输入命令 php artisan migrate

⑤利用Seeder和Factory填充测试数据

• 创建TodoFactory：php artisan make:factory <工厂名称> -m <模型名>

• 创建TodoSeeder填充数据并在其中引用factory生成伪数据

• 创建TodoSeeder：php artisan make:seeder <seeder名称>

• 在终端执行seed操作，并在数据库验证填充情况

三、MVC模式下实现TODOS列表

（1） M —— Todo Model 模型数据

（2） V —— todos/index.blade.php 视图

（3） C —— TodoController 控制器

（4） 在C中取出M中的数据送到V中显示

四、视图层部分

（1）welcome. blade.php欢迎界面

视图

路由

效果图

点击TODOS APP即可实现页面跳转

（2）index.blade.php列表展示

视图

路由

效果图

（3）app.blade.php 导航栏与提示

视图

效果图

（4）create.blade.php向列表添加新内容

路由

效果图

①未输入完整

②输入完整

（5）show.blade.php 查看详情

点击view即可跳转到show.blade.php

视图

路由

效果图

（6）edit.blade.php

视图

路由

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-l5uI0KiT-1593518845348)(media/1379219f5f7308f8019fc3efee62a9da.png)]

效果图

五、控制器

（1）数据创建

表单数据提交在create.blade.php中

控制器

在TodoController.php的一部分

效果图

新建表单内容时的提示消息已在四-（4）展示。当新建内容提交成功后，会在列表中展示出来。如四-（4）的新建内容

（2）数据修改

表单数据修改在edit.blade.php中

控制器

在TodoController.php的一部分

效果图

①修改前

②修改内容

③提交修改

（3）数据删除

表单数据修改在index.blade.php中

控制器

在TodoController.php的一部分

效果图

①删除前

②删除后（删除了第三个）

（4）已完成的显示

视图层信息在index.blade.php中

控制器

在TodoController.php的一部分

效果图

①点击Complete前

②点击后

（2）已完成的取消

视图层信息在show.blade.php中

控制器

在TodoController.php的一部分

效果图

①随机选一个表示为已完成的项。点击VIEW

②点击Conceal

（2）已完成的取消

视图层信息在show.blade.php中

控制器

在TodoController.php的一部分

效果图

①随机选一个表示为已完成的项。点击VIEW

②点击Conceal