3.4. 新建收货地址

新增收货地址页面

接下来我们要做的是新增收货地址的页面。

UserAddressesController 中新增一个 create() 方法:

app/Http/Controllers/UserAddressesController.php

use App\Models\UserAddress;
.
.
.
    public function create()
    {
        return view('user_addresses.create_and_edit', ['address' => new UserAddress()]);
    }
.
.
.

由于新增页面和编辑页面比较类似,所以共用一个模板文件 create_and_edit

然后添加一个路由:

routes/web.php

.
.
.
Route::group(['middleware' => ['auth', 'verified']], function() {
    .
    .
    .
    Route::get('user_addresses/create', 'UserAddressesController@create')->name('user_addresses.create');
});

1. 省市区联动组件

收货地址一个核心功能就是省市区三级联动下拉,这是一个比较复杂的前端操作,我们这里使用 Vue 来实现。

本文章首发在 LearnKu.com 网站上。

为了保证课程的高品质,我们需要对课程进行收费。付费后 才能观看剩余内容。 购买

上一篇 下一篇
《L03 构架 API 服务器》
你将学到如 RESTFul 设计风格、PostMan 的使用、OAuth 流程,JWT 概念及使用 和 API 开发相关的进阶知识。
《L04 微信小程序从零到发布》
从小程序个人账户申请开始,带你一步步进行开发一个微信小程序,直到提交微信控制台上线发布。
贡献者:2
讨论数量: 69

小小的花花
WIN10 安装 yarn add china-area-data 出错后解决方法
3 个点赞 | 1 个回复 | 分享 | 课程版本 5.5
proHorry
overture/lang 这个包崩了?
2 个点赞 | 15 个回复 | 问答 | 课程版本 5.5
瀚海栏杆
中文安装后不起作用
2 个点赞 | 4 个回复 | 问答 | 课程版本 5.7
kelvinblood
地区三级联动,新手容易只出现 {{name}} 的一个隐蔽原因
2 个点赞 | 0 个回复 | 分享 | 课程版本 5.7
zxx123
三级联动 只有 {{ name }} ?
1 个点赞 | 10 个回复 | 问答 | 课程版本 5.5
doubidage
地区三级联动?只出{{name}},vue 没引入成功
1 个点赞 | 5 个回复 | 问答 | 课程版本 5.7
米朵
新增收货地址为什么显示出来一闪而过?
1 个点赞 | 5 个回复 | 问答 | 课程版本 5.5
ZcZmm
安装中文语言包问题
1 个点赞 | 0 个回复 | 分享 | 课程版本 5.5
uu_boy
为什么地址联动不显示的问题?
0 个点赞 | 9 个回复 | 问答 | 课程版本 5.5
xjxjxj
为什么添加地址都不显示省市县呢
0 个点赞 | 8 个回复 | 问答 | 课程版本 5.7
Jason_Lai
地区三级联动?
0 个点赞 | 8 个回复 | 问答 | 课程版本 5.5
18874127314
三级联动只有{{name}} 5.7 版本的
0 个点赞 | 7 个回复 | 问答 | 课程版本 5.7
裴雷
新建收货地址时报错
0 个点赞 | 6 个回复 | 问答 | 课程版本 5.7
yanger
新增收获地址 app.js 注册不上了——
0 个点赞 | 6 个回复 | 问答 | 课程版本 5.5
surest
EIO: i/o error, close 怎么解决呢
0 个点赞 | 5 个回复 | 问答 | 课程版本 5.5
sunkai
This action is unauthorized.?未授权?
0 个点赞 | 5 个回复 | 问答 | 课程版本 5.5
huzhuolei
案例中缺少邮编、手机号码格式判断
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
jianghuangc
代码提示的问题
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
kdj1219
china-area-data 港澳台有 error 其他都可以用
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
lianglunzhong
Mac yarn add 一直在等待?
0 个点赞 | 4 个回复 | 问答 | 课程版本 5.5
yanger
也页面打不开了,报 500。。
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.5
三联动突然没有数据?
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.5
假装是米粉
NPM run watch-poll 运行报错?
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.5
Monica71725
访问 http://shop.test/user_addresses/create 出错!
0 个点赞 | 2 个回复 | 分享 | 课程版本 5.8
echopeimeng
提交一个省市区的 bug,
0 个点赞 | 2 个回复 | 分享 | 课程版本 5.8
jfaWei
validation 验证错误信息可以自己加中文语言包
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.7
黄海鹏
地区三级联动不显示
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.7
doubidage
我要跨页访问 地址的状态,但没有成功,请教。。。
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.7
doubidage
新增收货地址 表单交报 403
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.7
吃瓜群众
o => o === value [1] 是什么含义?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
HACK_QC
为什么提交的时候获取不到表单数据呢
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
ishu
三级联动只有{{name}}的一种原因
0 个点赞 | 2 个回复 | 分享 | 课程版本 5.5
liuyi
使用 vue 的单文件组件编写省市区联动组件可以吗?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
HectorChan
填写收货地址这里有一个问题?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
Oyxiaoxi
安装中文语言包时报错?
0 个点赞 | 2 个回复 | 教程 | 课程版本 5.5
hsy
报错 [Vue warn]: Cannot find element: #App?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
18865477815
使用 win7 安装 yarn add china-area-data 出现错误?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
ekstar
没加载上数据怎么回事呢?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
EDISONYANG
为什么省市区没赋值成功呢?
0 个点赞 | 2 个回复 | 问答 | 课程版本 5.5
我真叫阳阳
提交收货地址报错
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
shenghuo1991
Sublime 编辑器代码追踪问题
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.7
doubidage
<option v-for="(name, id) in districts" :value="id">@{{ name }}</option>
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.7
doubidage
地区三级联动?只出{{name}},vue 怎么引入。vue.js 放在哪里
0 个点赞 | 1 个回复 | 教程 | 课程版本 5.7
caston
报错信息是 validation.required but not province is required
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
A_aliane
为啥我的三级分类显示不出来
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
myhyperion
验证失败后能否保留省市信息?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
mjg01
vue 报错 make sure to provide the "name" option.
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
小丢丢
表单验证信息空格有办法去掉吗?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
silasyao
收货地址 index 页面
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
小宝爹
汉化包不起作用?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
hsy
app.js 太大了?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
ekstar
提交后不出现错误提示?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
18865477815
Module build failed: Duplicate declaration "App"?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
yangyang2018
这个页面显示有地址,但是数据库里面什么没有数据的?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
yangyang2018
<user-addresses-create-and-edit inline-template>这句代码什么意思?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
david19931217
内联模板和 slot 区别?
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
添加收货地址的时候,不能以 0 开头 ??
0 个点赞 | 1 个回复 | 问答 | 课程版本 5.5
stefen
汉化包不起作用
0 个点赞 | 0 个回复 | 教程 | 课程版本 5.8
molangxx
省市区隐藏字段无法获取到值的一个可能原因
0 个点赞 | 0 个回复 | 分享 | 课程版本 5.5
Fykex
vue 组件通讯
0 个点赞 | 0 个回复 | 分享 | 课程版本 5.7
战狼1991
resource
0 个点赞 | 0 个回复 | 分享 | 课程版本 5.5
yangyang2018
什么回事???
0 个点赞 | 3 个回复 | 问答 | 课程版本 5.5