插入数据:准备添加创建资源需要的视图

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

现在我们可以去准备一个创建资源用的表单 .. 可以在命令行下面,执行一下

→ adonis make:view post.create --layout layouts.main

回到项目 .. 在 resources .. views .. post 的下面,打开 create.edge .. 在这个视图文件里已经设置成了视图要使用的布局 ..

在这个视图里,用一组 section .. 设置一下布局里的 content 这个区域里面的内容 .. 一个 div,加上 container ..

里面先添加一个大标题 .. h3 加上两个工具类 . mt-5,mb-4 .. 设置元素的上下外边距 .. 标题文字是 Add New Post ..

标题的下面是个表单 .. 用一组 form .. action 设置成 /posts . method 是 POST ..

表单里有几个元素 .. 先添加一个包装 .. 上面加上 form-group .. 添加一个 label 标签 .. for title .. 标签是 Title ..

然后是一个 input ,类型是 text .. 添加一个 form-control 这个类 .. name 是 title .. placeholder .. Enter title here

input.form-control[placeholder="Enter title here" name="title"]

下面是个文本框,可以在里面输入文章的具体的内容 .. 一个包装,上面加上 form-group .. 一个 label .. for content .. 文字是 Content

下面是个 textarea 文本区域 .. 加上 form-control 这个类 .. placeholder 是 Write something amazing .. name ,名字是 content ...

Adonis 框架会对 POST 这种方法的请求做 CSRF 保护 .. 所以在表单里面,我们需要添加一个 csrfField .. {{ csrfField() }}

最后是一个提交表单用的按钮 .. button.btn.btn-primary[type='submit'] ... 按钮上的文字是 Submit ..

测试

下面可以再打开 PostController ... 找到里面的 create 这个方法 .. 在方法里面,先把 view 解构出来 ... 然后让方法去渲染一个视图 .. return 一个 view.render .. 视图是 post.create ..

回到浏览器 ... 可以访问一下创建 Post 资源的时候用的表单 .. 地址就是 posts/create ..

这里显示的就是刚才我们创建的 post.create 这个视图 ..

检查一下页面元素 ...

在表单里,有个隐藏字段 .. 就是这个 _csrf ... 它是我们在视图里使用 csrfField 输出的一个字段 ..

插入数据:准备添加创建资源需要的视图《 Node.js 应用:查询构建器 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点