Laravel Vuejs 实战：开发知乎 （7）验证问题表单字段

上一节代码中已经实现 下面代码中的validate内部配置就是：

  1 public function store(Request $request)
  2     {
  3         //
  4         $data = $request->validate([
  5             'title' => 'required|min:8',
  6             'content' => 'required|min:8',
  7         ]);
  8
  9         $data['user_id'] = auth()->user()->id;
 10
 11         $question = Question::create($data);
 12
 13         return redirect()->route('questions.show', $question);
 14     }

注：validate方法详见：表单验证

且 create.blade.php中也已经使用

  1 <p class="text text-danger"> @error('title') {{ $message }} @enderror </p>
  2
  3  <p class="text text-danger"> @error('content') {{ $message }} @enderror </p>
  4 

实现错误提示。不过差一个错误后，留存用户上一次填写的内容，输出给用户用于再次修改，

然后代码如下：

  1 @extends('layouts.app')
  2 @section('content')
  3     @include('vendor.ueditor.assets')
  4     <div class="container">
  5         <div class="row">
  6             <div class="col-md-8 col-md-offset-2">
  7                 <div class="card">
  8                     <div class="card-header">
  9                         发布问题
 10                     </div>
 11                     <div class="card-body">
 12                         <form action="{{ route('questions.store') }}" method="post">
 13                             {{--注意要有csrftoken--}}
 14                             @csrf
 15                             <div class="form-group">
 16                                 <label for="title">标题</label>
 17                                 <input type="text" name="title" class="form-control" placeholder="标题" id="title"
 18                                        value="{{ old('title') }}">
 19                                 <p class="text text-danger"> @error('title') {{ $message }} @enderror </p>
 20                             </div>
 21                             <!-- 编辑器容器 -->
 22                             <script id="container" name="content" type="text/plain">{!! old('content') !!}</script>
 23                             <p class="text text-danger"> @error('content') {{ $message }} @enderror </p>
 24                             <!--发布按钮-->
 25                             <button type="submit" class="btn btn-primary mt-2 float-md-right">发布问题</button>
 26                         </form>
 27                     </div>
 28                 </div>
 29             </div>
 30         </div>
 31     </div>
 32
 33     <!-- 实例化编辑器 -->
 34     <script type="text/javascript">
 35         var ue = UE.getEditor('container');
 36         ue.ready(function () {
 37             ue.execCommand('serverparam', '_token', '{{ csrf_token() }}'); // 设置 CSRF token.
 38         });
 39     </script>
 40
 41 @endsection

当然如果验证要求比较多，可以执行：

  1 php artisan make:request QuestionStoreRequest

然后将QuestionController.php文件中验证部分注释掉，我们将使用依赖注入QuestionStoreRequest实例的方式处理请求验证，

  1 <?php
  2
  3 namespace App\Http\Controllers;
  4
  5 use App\Http\Requests\QuestionStoreRequest;
  6 use App\Models\Question;
  7 use App\User;
  8 use Illuminate\Http\Request;
  9
 10 class QuestionController extends Controller
 11 {
 12     public function __construct()
 13     {
 14         $this->middleware('auth', ['except' => ['index', 'show']]);//非注册用户只能查看不能编辑添加更改删除
 15     }
 16
 17     /**
 18      * Display a listing of the resource.
 19      *
 20      * @return \Illuminate\Http\Response
 21      */
 22     public function index()
 23     {
 24         //
 25
 26     }
 27
 28
 29     /**
 30      * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
 31      */
 32     public function create()
 33     {
 34         //
 35         return view('questions.create');
 36     }
 37
 38
 39     /**
 40      * @param QuestionStoreRequest $request
 41      * @return \Illuminate\Http\RedirectResponse
 42      */
 43     public function store(QuestionStoreRequest $request)//依赖注入QuestionStoreRequest实例
 44     {
 45         //
 46 //        $data = $request->validate([
 47 //            'title' => 'required|min:8',
 48 //            'content' => 'required|min:28',
 49 //        ]);
 50         $data = $request->all();
 51         $data['user_id'] = auth()->user()->id;
 52
 53         $question = Question::create($data);
 54
 55         return redirect()->route('questions.show', $question);
 56     }
 57
 58
 59     /**
 60      * @param Question $question
 61      * @return \Illuminate\Contracts\View\Factory|\Illuminate\View\View
 62      */
 63     public function show(Question $question)
 64     {
 65         //
 66         return view('questions.show', compact('question'));
 67     }
 68
 69     /**
 70      * Show the form for editing the specified resource.
 71      *
 72      * @param int $id
 73      * @return \Illuminate\Http\Response
 74      */
 75     public function edit($id)
 76     {
 77         //
 78     }
 79
 80     /**
 81      * Update the specified resource in storage.
 82      *
 83      * @param \Illuminate\Http\Request $request
 84      * @param int $id
 85      * @return \Illuminate\Http\Response
 86      */
 87     public function update(Request $request, $id)
 88     {
 89         //
 90     }
 91
 92     /**
 93      * Remove the specified resource from storage.
 94      *
 95      * @param int $id
 96      * @return \Illuminate\Http\Response
 97      */
 98     public function destroy($id)
 99     {
100         //
101     }
102 }
103
104 

将表单的验证移动到生成的Requests/QuestionStoreRequest.php文件内，代码如下：

  1 <?php
  2
  3 namespace App\Http\Requests;
  4
  5 use Illuminate\Foundation\Http\FormRequest;
  6
  7 class QuestionStoreRequest extends FormRequest
  8 {
  9     /**
 10      * Determine if the user is authorized to make this request.
 11      *
 12      * @return bool
 13      */
 14     public function authorize()
 15     {
 16         //一般判断当前用户是否有权发送本实例的请求,先默认设置为true，不过可以先写一个判断当前用户是否是请求中的用户来判断返回值
 17
 18         return true;
 19     }
 20
 21     /**
 22      * Get the validation rules that apply to the request.
 23      * 验证规则
 24      * @return array
 25      */
 26     public function rules()
 27     {
 28         return [
 29             //
 30             'title' => 'required|min:8',
 31             'content' => 'required|min:28',
 32         ];
 33     }
 34
 35     public function messages()
 36     {
 37 //        return parent::messages(); // TODO: Change the autogenerated stub
 38         //错误提示
 39         return [
 40             'title.required' => '标题必须要输入的哦！',
 41             'title.min' => '标题长度要大于8个的哦！',
 42             'content.required' => '内容必须要输入的哦！',
 43             'content.min' => '内容长度必须要大于28个的哦！',
 44         ];
 45     }
 46 }
 47
 48