1.wx:for
效果:
(1)js代码
data: {
address:[
{
Provincial:'湖南省',
urban:'株洲市',
areas:'天元区',
complete_address:'湖南工业大学一食堂',
default_address:1,
order_usegender:'女士',
order_buyname:'龙某某',
order_tel:'13045897854',
},
{
Provincial:'湖南省',
urban:'长沙市',
areas:'芙蓉区',
complete_address:'芙蓉路某某街道23-124',
default_address:'0',
order_usegender:'男',
order_buyname:'33',
order_tel:'15245686984',
}
]
},
(2)wxml代码
<view wx:for="{{address}}" wx:for-item="address" class="box1" wx:key="key">
<!--详细地址-->
<view>
<view class="box2">
<view class="detail_address">
{{address.Provincial}}{{address.urban}}{{address.areas}}{{address.complete_address}}
</view>
<view wx:if="{{address.default_address}}"class="default_address">
<view style="margin-left:5rpx"> 默认</view>
</view>
<view wx:else></view>
</view>
<view class="box3">
<!--用户点单所用信息-->
<view class="use_massege">
<view class="use_name"> {{address.order_buyname}}</view>
<view class="use_gender">{{address.order_usegender}}</view>
<view class="use_tel">{{address.order_tel}}</view>
</view >
<!--编辑模块-->
<view class="edit_view" >
<image src="/static/images/commom/edit.jpg" class="edit_img" bindtap="edit_address"></image>
</view>
</view>
</view>
</view>
(3)使用wx:for遇到的警告:Now you can provide attr wx:key
for a wx:for
to improve performance.
这是一个关于性能优化方面的提示.不处理不影响程序运行。
在wx:for后面添加wx:key=“key” 可消除警告。
2.wx:if 条件判断
(1)
<view wx:if="{{address.default_address}}"class="default_address">
//{{address.default_address}}为真 执行的代码块
</view>
<view wx:else>
//{{address.default_address}}为假 执行的代码块
</view>
(2)wx:if wx:else 嵌套使用
<!--按钮-->
<view class="button">
<view wx:if="{{item.static_id==1}}">
<button >去支付</button>
</view>
<view wx:elif="{{item.static_id==1}}">
<button >催单</button>
</view>
<view wx:else>
<button >查看订单详情</button>
</view>
</view>