Day17-购物车页面-收获地址-初步封装my-address组件-创新互联

1.创建收货地址组件(my-address)

专注于为中小企业提供网站建设、网站制作服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业吉首免费做网站提供优质的服务。我们立足成都,凝聚了一批互联网行业人才,有力地推动了上1000+企业的稳健成长,帮助中小企业通过网站建设实现规模扩充和转变。

我的操作:

1>在uni_modules文件夹右键新建一个组件

2>还需要自己补全代码

1>和2>的阶段效果图:

my-address组件已经被渲染成功了。

*************************************************************************************************************

2.渲染收货地址组件的基本结构:

我的操作:

1》初步的一个UI结构:

2》上面的UI结构对应的样式:

1》 和 2》 的效果图:

4》进一步渲染其UI结构:

具体内容:

5》对4》编写其css样式:

4》 和 5》 的效果图:

**************************************************************************************************************

2.实现收货地址区域的按需展示

我的操作:

1》在 data 中定义收货地址的信息对象:

2》使用 v-if和 v-else实现按需展示:

3》测试一下:

①:当address是空对象的情况:

②:当address不是空对象的情况:

你是否还在寻找稳定的海外服务器提供商?创新互联www.cdcxhl.cn海外机房具备T级流量清洗系统配攻击溯源,准确流量调度确保服务器高可用性,企业级服务器适合批量采购,新人活动首月15元起,快前往官网查看详情吧


当前文章:Day17-购物车页面-收获地址-初步封装my-address组件-创新互联
标题来源:http://scyanting.com/article/dipidj.html