先在导航栏上添加一个文件上传小图标，这个导航栏我现在放在一个 partial 里了 .. 位置是 resources .. views .. partials .. 打开这个 navbar.edge ..

复制一下这个加号小图标 .. 添加一个上传小图标 .. 图标是 fa-upload .. 图标链接到的地址可以使用一个 route 方法 .. 路由的名字是 upload ...

再去创建一个资源控制器 .. 在命令行的下面，执行一下 .. adonis make:controller 名字是 file .. 加上 resource 选项 ..

回到项目 .. 找到刚才创建的控制器 .. FileConroller.js ...

在它的 create 方法里面，需要用到 view ，把它解构出来 .. 让方法渲染一个视图 ... view.render .. 视图可以是 file.create ..

下面再去创建这个视图 ..

放在 resources .. views ，file 目录的下面，名字是 create.edge .. 设置一下视图使用的布局 ... layouts.main .. 再设置一下这个布局里的 content 区域里的内容 .. 一个 div .. container ..

里面包装一个标题 .. 加上 my-5，添加点上下的外边距 .. 标题文字是 Upload ..

表单

标题的下面是个上传文件用的表单 .. 一组 form 标签 .. 表单提交到的地址可以使用一个 route 方法，路由的名字是

FileController.store .. 这个路由的名字里面也可以使用资源的名字，比如 files.create .. 这样也可以 ..

提交的 method，就是方法设置成 POST .. 再用一个 enctype 设置一下表单数据的格式 .. 这里需要把它设置成 multipart/form-data ..

表单里面添加一个文件元素 .. 一个 div ，加上 form-group .. 里面是一个 file 类型的 input 元素 ..

元素需要一个名字，比如可以叫它 file .. 在处理提交表单请求的控制器方法里面，我们需要使用这个元素的名字，得到元素选择的文件 ..

再添加一个 csrf 字段 .. 用一下 csrfField() ..

下面再添加一个提交按钮 .. 按钮上面加上 btn btn-primary .. my-3 .. 按钮的 type 是 submit .. 按钮上的文字是 Submit ..

路由

再去设置一下应用的路由 .. 打开 start ... routes.js ... 先添加一条资源类型的路由，用一下 Route .. resource .. 资源是 files .. 用一下 FileController 来处理 ..

下面再去定义一条 get 类型的路由 .. 地址是 upload .. 使用 FileController 里的 create 来处理 .. 再给它起个名字 .. 叫 upload ..

预览

回到浏览器，可以再预览一下 ... 导航栏右上角会显示一个上传小图标 ... 按一下它，会打开一个 upload 页面，在这个页面上会有一个上传文件用的表单 ..