HTMl代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form action="{:url('imgs/upload')}" method="post" enctype="multipart/form-data">
<input type="file" name="imgs[]" multiple="multiple">
<input type="submit" value="提交"/>
</form>
</body>
</html>

控制器,视图展示,及添加:

controller添加入库:

<?php
namespace app\index\controller;
use think\Controller;
use think\Db; class Imgs extends Controller
{
//展示多文件添加视图
public function imgs(){
return view();
}
//接受用户表单提交的值

public function upload(){
// 获取表单上传文件
$files = request()->file('imgs');
foreach($files as $file){
// 移动到框架应用根目录/public/uploads/ 目录下
$info = $file->move(ROOT_PATH . 'public' . DS . 'uploads');
$data[] = '/uploads/'.$info -> getSaveName();
}
$arr['imgs'] = implode(',',$data);
// echo $arr;die;
$res = Db::name('admin') -> insert($arr);
if($res){
$this -> success('添加成功','show');
}else{
$this -> error('添加失败');
}
}
//添加入库后,展示视图
public function show(){
$data = Db::name('admin') -> select();
// dump($data);die;
foreach($data as $k => $v){
$data[$k]['imgs'] = explode(',',$v['imgs']);
}
// dump($data);die;
return view('show',['data' => $data]);
}
}

列表HTML代码:

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
</head>
<body>
{volist name="data" id="vo"}
{volist name="vo.imgs" id="v"}
<img src="__ROOT__/{$v}" alt=""/>
{/volist}
{/volist}
</body>
</html>

tip多文件上传(自找)的更多相关文章

  1. 移动商城第四篇【Controller配置、添加品牌之文件上传和数据校验】

    Controller层配置 编写SpringMVC的配置文件 springmvc.xml <?xml version="1.0" encoding="UTF-8&q ...

  2. vue element-ui 文件上传

    <el-upload class="upload-demo" action="" :before-remove="beforeRemove&qu ...

  3. 巧用 Jersey RESTful WebService框架解决文件上传乱码

    一.当我们使用jersey框架封装的restful进行文件上传时,会出现中文乱码,试用了过滤器设置编码都不管用.仔细想了很久解决办法,就用一个servelt来代替这个上传的restful接口实现上传的 ...

  4. JavaServlet的文件上传和下载

    关于JSP中的文件上传和下载操作 先分析一下上传文件的流程 1-先通过前段页面中的选择文件选择要上传的图片 index.jsp <%@ page language="java" ...

  5. jquery文件上传控件 WebUploader

    WebUploader是百度开源的一个文件上传组件,因为其操作简洁大方,就在项目中使用了,记录一下. 效果是这样子:  这个样子是默认的效果.  这个是选择上传的图片,可以批量,选择后可以删除和添加更 ...

  6. input file实现多选,限制文件上传类型,图片上传前预览功能

    限制上传类型 & 多选:① accept 属性只能与 <input type="file" /> 配合使用.它规定能够通过文件上传进行提交的文件类型. ② mu ...

  7. 文件上传-pubsec-文件上传大小限制

    文件上传-pubsec-文件上传大小限制 Caused by: java.lang.IllegalArgumentException: ContextPath must start with '/' ...

  8. vue + element 文件上传 并将文件转 base64

    当时有一个需求 是需要用到上传文件这个功能,并且需要将文件转为 base64 给到后台.网上找的全是啥图片转base64 肯定是因为这类需求比较常见.当时有点懵了.后面一想,都他娘是文件啊.然后就找到 ...

  9. vue大文件上传组件选哪个好?

    需求:项目要支持大文件上传功能,经过讨论,初步将文件上传大小控制在500M内,因此自己需要在项目中进行文件上传部分的调整和配置,自己将大小都以501M来进行限制. 第一步: 前端修改 由于项目使用的是 ...

随机推荐

  1. 「ZJOI2014」璀灿光华

    「ZJOI2014」璀灿光华 实际上,可以不用建水晶立方体... 因为,发光水晶的方向都要枚举一遍. 只需知道发光水晶每个方向有哪些水晶就可以了. 对于一个发光水晶,将它连接的水晶标号. 从该水晶bf ...

  2. idea2020.1版本的maven项目报包不存在,找不到包错误

    错误描述 idea创建maven项目,导入依赖都是成功,但是运行就会报找不到对应jar包的错误 解决办法: File -> Settings -> 搜索maven -> 展开mave ...

  3. 什么是Native方法 (转)

    一个Native Method就是一个java调用非java代码的接口(NDK也跟这有关吗?(疑问)一个Native Method由非java语言实现 在定义一个native method时,并不提供 ...

  4. vi TOhtml:复制保持格式和高亮

    1. 文本编辑:在vim中编辑好,复制到opera mail中就会格式错乱,比如:行前空格.缩进消失:2. 代码复制到其他地方,无法显示彩色高亮:找到了一个变通方案:使用TOhtml把vim内容转换为 ...

  5. Java线程--LockSupport使用

    原创:转载需注明原创地址 https://www.cnblogs.com/fanerwei222/p/11871805.html Java线程--LockSupport使用 public static ...

  6. Exception in thread "main" java.lang.UnsupportedClassVersionError: org/apache/zeppelin/server/ZeppelinServer : Unsupported major.minor version 52.0

    在启动Zeppelin时遇到了该问题: [root@quickstart bin]# ./zeppelin-daemon.sh restart Please specify HADOOP_CONF_D ...

  7. 申请免费的ssl通配符证书

    吐曹: 为了给我网站配置免费的htpps证书费死劲了, 折腾了一天, 找阿里阿里给我反馈的和我自己看的一样, 没什么用 我用Certbot生成证书以后怎么访问都是阿里的免费的hppts证书, 我都把阿 ...

  8. 手把手带你安装最小化suse 12 linux

    当然. 你需要现有一个vmware,还要有一个suse的镜像,suse镜像可以直接去官网获取,只需要注册一个suse的账号就可以了,官网下载会有点慢,可以使用迅雷下载 F2 可以设置安装界面的语言,可 ...

  9. 『无为则无心』Python面向对象 — 45、面向对象编程

    目录 1.面向对象编程的概念 2.面向对象编程和面向过程编程的区别 (1)面向过程编程 (2)面向对象编程 3.举例理解面向对象 4.Python的面向对象编程 5.面向对象的几大核心特性 1.面向对 ...

  10. Java IO模型:BIO、NIO、AIO

    Java IO模型:BIO.NIO.AIO 本来是打算直接学习网络框架Netty的,但是先补充了一下自己对Java 几种IO模型的学习和理解.分别是 BIO.NIO.AIO三种IO模型. IO模型的基 ...