laravel文件上传，视图添加内容到数据库，视图分页显示数据库的内容

最新推荐文章于 2025-03-08 00:18:25 发布

隔山隔海syx

最新推荐文章于 2025-03-08 00:18:25 发布

阅读量1.4k

点赞数 4

本文链接：https://blog.youkuaiyun.com/qq_45844648/article/details/105682795

版权

一，文件上传到数据库：

继续上次的项目进行编写，项目地址：laravel自动验证项目地址

https://blog.youkuaiyun.com/qq_45844648/article/details/105536922

当做一个http请求来看待。

（1），首先要修改表的结构，给member表添加一个字段，字段名为avatar avatar
（2）创建添加数据的表单和路由，这里继续使用前面项目的路由，也就是下面这些代码：

控制器里的代码；

//用来自动验证
public function testbiaodan(Request $request){
 $this->validate($request,[
        'id' => 'required|min:2|max:6',
        'name' => 'required|min:2|max:255',
        'age' => 'required|integer|min:0|max:100',
        'email' => 'required|email'
    ]);
    // 处理文件上传的操作
    if($request->hasFile('avatar')&&$request->file('avatar')->isvalid()){
        // 对上传的文件进行必要处理
        $filename=date('ymdHis').rand(100000,999999).'.'.$request->file('avatar')->extension();
        // 移动文件到指定目录下
        $request->file('avatar')->move('./statics/upload',$filename);
    }
    // 验证成功后提示信息
    echo '验证成功';
}

创建路由；（验证信息发送到的位置的提交方式必须为post）

Route::get('biaodan','TestController@biaodan');
Route::post('testbiaodan','TestController@testbiaodan')->name('tb');

用户交互页面，也就是biaodan.php(就是对应创建路由的第一个参数)

必须要添加enctype="multipart/form-data"
提交方式必须为post
至少有一个input类型为file

  <form action="{{route('tb')}}" method="post" enctype="multipart/form-data">
       <input type="text" name="id" placeholder="学号"/>
       <br />
       <input type="text" name="name" placeholder="姓名"/>
       <br />
       <input type="text" name="age" placeholder="年龄"/>
       <br />
       <input type="text" name="email" placeholder="邮箱"/>
       <br />
       头像
       <br />
       <input type="file" name="avatar"/>
       <br />
       <!-- 下面两种方式都可使用 -->
       <!-- <input type="hidden" name="_token" value="{{csrf_token()}}"/> -->
       {{csrf_field()}}
       <input type="submit"/>
	  @if (count($errors) > 0)
		   @foreach ($errors->all() as $error)
			   <li>{{ $error }}</li>
		   @endforeach
	   @endif

（3），在laravel文件的目录，public目录下建立一个statics目录,在statics下再建立一个upload文件
文件上传的位置
在这里插入图片描述
（4）在表单页面进行验证，并选择文件，点击提交

（5），如果出现在控制器文件下写入的验证成功提示信息，则文件上传成功
此时，刚才建立的文件目录下就会有上传的文件啦，上传的文件名和路径都在控制器文件里写入
在这里插入图片描述

项目中使用`./`和`/`的区别：

如果一个路径是给php代码使用的时候最好使用./
如果一个路径是给前端浏览器使用的时候则用/（在后端代码中./代表的是磁盘根目录，不是项目或站点根目录）

（6），把数据添加到数据表中
在控制器方法里，获取数据。
关于数据接收，可以使用input类，也可以使用request类：

$request->get();获取所有的
$request->all();获取所有的
$request->only(); 只需要数据表的部分参数
$request->except(); 删除不需要的参数
$request->has();判断某个参数有没有

request获取请求信息的方法。
https://blog.youkuaiyun.com/lw545034502/article/details/84523988

// 获取数据，存入数据库
//只需要id，name，age，email，这几个字段
    $data=$request->only(['id','name','age','email']);
    //获取上边传入到public/statics/upload/下的文件，上传到数据库的avatar表
    $data['avatar']='/statics/upload/'.$filename;//找到statics/upload里面的数据
    $res=Member::insert($data);//插入到数据表
    // 获取错误信息
    // $aa=$request->file('avatar')->getErrorMessage();
     if($res){
        // 验证成功后提示信息
        echo '验证成功';
    }else{
        // 验证成功后提示信息
        echo '验证失败';

    }

访问表单页面，填入要存入数据库的数据，按要求填写，提交

在这里插入图片描述

点开Navicat查看数据表里，刷新一下，此时数据表里就有刚才添加的数据表了

好了文件上传成功，下一步就是现实数据库里的内容了

二，在前端页面，显示数据表里的内容

（1），创建控制器方法。

// 数据分页，分页展示数据库里面的数据
public function fenye(){
    // 获取member表数据
    $data=Member::all();
    return view('fenye',compact('data'));
}

（2），配置路由。

Route::get('fenye','TestController@fenye');

（3），创建视图文件 fenye.blade.php

<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>分页显示数据</title>
        <style>

        </style>
    </head>
    <body>
       <table border="1px" rules="all" bordercolor="black"width="200px" height="250px" style="margin-bottom: 20px;">
           <thead align="center">
               <tr>
                   <th>序号</th>
                   <th>姓名</th>
                   <th>年龄</th>
                   <th>邮箱</th>
                   <th>头像</th>
                   <th>状态</th>
               </tr>
           </thead>
           <tbody align="center">
               @foreach($data as $value)
               <tr>
                   <td>{{$value->id}}</td>
                   <td>{{$value->name}}</td>
                   <td>{{$value->age}}</td>
                    <td>{{$value->email}}</td>
                   <td><img src="{{$value->avatar}}" width="80px"/></td>
                   <td>
                        @if($value->status==1)
                            正常
                        @else
                            禁用
                        @endif
                   </td>
               </tr>
               @endforeach
           </tbody>
       </table>
    </body>
</html>

(4),现在显示效果就是

数据表里的内容，
在这里插入图片描述
查询显示的内容，（原来图片显示有问题，我把数据删了，重新上传了一下新的数据，所以和上图中数据表中的数据不太一样，忽略下面分页的地方，修改的时候添加了分页）

三，分页，显示查出来的数据

(1)在数据方法中添加：：
分页使用的是模型：：::paginate(2)，表示一页显示两条数据
直接限制条数就可以，

// 数据分页，分页展示数据库里面的数据
public function fenye(){
    // 获取数据
    $data=Member::paginate(2);
    return view('fenye',compact('data'));
}

（2）在视图文件里添加，{{$data->links()}}就可以实现分页查询

 <table border="1px" rules="all" bordercolor="black"width="200px" height="250px" style="margin-bottom: 20px;">
           <thead align="center">
               <tr>
                   <th>序号</th>
                   <th>姓名</th>
                   <th>年龄</th>
                   <th>邮箱</th>
                   <th>头像</th>
                   <th>状态</th>
               </tr>
           </thead>
           <tbody align="center">
               @foreach($data as $value)
               <tr>
                   <td>{{$value->id}}</td>
                   <td>{{$value->name}}</td>
                   <td>{{$value->age}}</td>
                    <td>{{$value->email}}</td>
                    <!-- ltrim($value->avatar),'.' -->
                   <td><img src="{{$value->avatar}}" width="80px"/></td>
                   <td>
                        @if($value->status==1)
                            正常
                        @else
                            禁用
                        @endif
                   </td>
               </tr>
               @endforeach
           </tbody>
           <tfoot>
               <tr>
                   <td colspan="3">{{$data->links()}}</td>
               </tr>
           </tfoot>
       </table>

（3）显示效果，可以点击下面的数字，进行分页查看
在这里插入图片描述
（4）可以吧分页选择那几个数字旁边的<>换成上一页，下一页
在laravel项目里打开命令行窗口，按住shift+鼠标右键
输入 php artisan vendor:publish --tag=laravel-pagination
把配置文件复制到\resources\views\vendor\pagination\bootstrap-4.blade
打开bootstrap-4.blade进行配置
在这里插入图片描述
把配置文件复制到\resources\views\vendor\pagination\bootstrap-4.blade
打开bootstrap-4.blade进行配置，换成上一页下一页

现在就成功了！！！！