用laravel框架创建todos
2020-07-21 04:12
1221 查看
用laravel框架创建todos
一:laravel环境配置
1.下载php
2.搭建laravel开发环境laragon
3.创建laravel工程
4.reload apache,再次运行Laravel,再查看todos
二:在Laravel中创建视图
1.blade模板布局
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta content="width=device-width, initial-scale=1 shrink-to-fit=no" name="viewport"> <title>@yield('title')</title> <!-- Fonts --> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css"> </head> <body> <nav class=" navbar fixed-top navbar-expand-lg navbar-dark bg-primary"> <a class="navbar-brand" href="/">TODOS APP</a> <button class="navbar-toggler d-lg-none" type="button" data-toggle="collapse" data-target="#collapsibleNavId" aria-controls="collapsibleNavId" aria-expanded="false" aria-label="Toggle navigation"> </button> <div class="collapse navbar-collapse" id="collapsibleNavId"> <ul class="navbar-nav mr-auto mt-2 mt-lg-0"> <li class="nav-item active"> <a class="nav-link" href="/">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="/todos">Todos</a> </li> <li class="nav-item"> <a class="nav-link" href="/todos/create">Create</a> </li> </ul> </div> </nav> <div class="container pt-5"> @if(session()->has('success-info')) <div class="pt-sm-3"> <div class="alert alert-success mt-2" role="alert"> {{session('success-info')}} </div> </div> @endif @yield('content') </div> <script src="https://code.jquery.com/jquery-3.4.1.slim.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js"></script> <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script> </body> </html>
2.blade.php用于列表展示,并在视图中引入bootstrap板块
3.添加show.blade.php展示单个资源
@extends('layouts.app') @section('title', 'TODO SHOW') @section('content') <h1 class="text-center my-5">{{$todo->name}}</h1> <div class="row justify justify-content-center"> <div class="col-md-8"> <div class="card"> <div class="card-header font-weight-bold d-flex align-items-center justify-content-between"> Detail @if($todo->is_completed) <span class="badge badge-pill badge-success float-right">已完成</span> @else <span class="badge badge-pill badge-danger float-right">未完成</span> @endif </div> <div class="card-body"> {{$todo->description}} </div> <div class="card-footer"> <a href="/todos/{{$todo->id}}/edit" class="btn btn-block btn-outline-success">Edit</a> </div> </div> </div> </div> @endsection
4.在resources/views/todos下创建create.blade.php
@extends('layouts.app') @section('title', 'TODO SHOW') @section('content') <h1 class="text-center my-5">{{$todo->name}}</h1> <div class="row justify justify-content-center"> <div class="col-md-8"> <div class="card"> <div class="card-header font-weight-bold d-flex align-items-center justify-content-between"> Detail @if($todo->is_completed) <span class="badge badge-pill badge-success float-right">已完成</span> @else <span class="badge badge-pill badge-danger float-right">未完成</span> @endif </div> <div class="card-body"> {{$todo->description}} </div> <div class="card-footer"> <a href="/todos/{{$todo->id}}/edit" class="btn btn-block btn-outline-success">Edit</a> </div> </div> </div> </div> @endsection
5.在resources/views/todos下创建编辑页edit.blade.php
@extends('layouts.app') @section('title', 'TODO EDIT') @section('content') <h1 class="text-center my-5">EDIT TODO</h1> <div class="row justify justify-content-center"> <div class="col-md-8"> <div class="card"> <div class="card-header"> EDIT </div> <div class="card-body"> <form action="/todos/{{$todo->id}}" method="post"> @csrf <div class="form-group"> <label for="name">Name</label> <input type="text" name="name" id="name" value="{{$todo->name}}" class="form-control @error('name') is-invalid @enderror"> @error('name') <div class="invalid-feedback"> {{$message}} </div> @enderror </div> <div class="form-group"> <label for="description">Description</label> <textarea name="description" id="description" rows="3" class="form-control @error('description') is-invalid @enderror"> {{$todo->description}}</textarea> @error('description') <div class="invalid-feedback"> {{$message}} </div> @enderror </div> <button type="submit" class="btn btn-primary float-right">Submit</button> </form> </div> </div> </div> </div> @endsection
三:添加路由
1.在routes/web.php中创建todo添加路由
Route::(uri:'/',function(){ return view(vie:'welcome'); }); Route::get(uri:'/todos',action:'TodeController@index');
2.创建页获取路由
Route::get('/todos/create','TodoController@create'); Route::get('/todos/{todo}','TodoController@show');//单个资源访问路由 Route::post('/todos','TodoController@store');//创建TODO提交的处理页路由`
3.编辑页获取路由
Route::post('/todos/{todo}','TodoController@update'); Route::patch('/todos/{todo}','TodoController@update');
4.删除TODO的处理页路由
Route::delete('/todos/{todo}','TodoController@destroy');
5.完成TODO的处理页路由
Route::patch('/todos/{todo}/completed','TodoController@complete');
四:controller控制器
1.在app/Http/Controller中建立TodoController控制器
2.列表中的记录按创建时间倒序排列
public function index() { $todos = Todo::query()->orderByDesc('created_at')->get(); return view('todos.index')->with(['todos' => $todos]);//将数据送给视图 }
3.编辑页获取办法
public function edit(Todo $todo) { //dd($todoId); //$todo = Todo::findOrFail($todoId); //return $todo; return view('todos.edit')->with(['todo'=> $todo]); }
4.show的获取方法和创建页的获取方法
public function show(Todo $todo) { //dd($todoId); //$todo = Todo::findOrFail($todoId); //return $todo; return view('todos.show')->with(['todo'=> $todo]); }
5.实现创建页的提交并添加后端验证,处理编辑页提交,处理删除,完成的
方法
public function store(Request $request) { $request->validate([ 'name' => 'required|min:3|max:20', 'description' => 'required' ]); $name = $request->get('name'); $description = $request->get('description'); $todo = new Todo(); $todo->name = $name; $todo->description = $description; $todo->save(); $request->session()->flash('success-info', 'Create successful!'); return redirect('/todos'); } public function update(Todo $todo, Request $request) { $request->validate([ 'name' => 'required|min:3|max:50', 'description' => 'required' ]); $name = $request->get('name'); $description = $request->get('description'); //$todo = Todo::findOrFail($todoId); $todo->name = $name; $todo->description = $description; $todo->save(); $request->session()->flash('success-info', 'Update successful!'); return redirect("/todos/{$todo->id}"); } public function complete(Todo $todo) { $todo->is_completed = true; $todo->save(); return redirect('/todos'); }
效果
相关文章推荐
- 使用laravel框架创建todos
- laravel框架学习(四)执行创建中间件后,提示无法找到该中间件的解决方法
- laravel框架中控制器的创建和使用方法分析
- Laravel / Lumen 框架修改 创建时间 和 更新时间 对应字段
- 深入理解Laravel框架--手动创建laravel框架(1)
- laravel框架下虚拟主机的创建
- Laravel5.1 框架模型创建与使用方法实例分析
- Laravel框架下创建命令行文件
- laravel框架创建授权策略实例分析
- Laravel框架模型的创建及模型对数据操作示例
- 深入理解Laravel框架--手动创建laravel框架(2)
- Laravel框架创建路由的方法详解
- laravel框架 创建控制器
- laravel框架-实现简单的文件上传
- 搭建你的Spring.Net+Nhibernate+Asp.Net Mvc 框架 (二)创建你的项目(转)
- Laravel 5.5框架 核心类Kernel
- Laravel框架数据库CURD操作、连贯操作总结
- 使用dom4j框架,创建xml文档并输出保存
- php Laravel 框架之建立后台文件夹
- tp框架创建新文件夹