小程序自定义模板

 新建一个模板(LIst.wxml) 

给模板取名name="listNone",引用时导入页面is="listNone"表示引用哪个模板

<template name="listNone">
 <view class="table">
  <view class="tr-1">
    <view class="th">订单详情</view>
  </view>
  <view>
    <view class="tr">
      <view class="td-1" selectable="true">订单号</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.orderNo}}</view></view>
    </view>
   <view class="tr">
      <view class="td-1" selectable="true">业务类型</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.businessType}}</view></view>
    </view>
    <view class="tr">
      <view class="td-1" selectable="true">进厂时间</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.limitedAt}}</view></view>
    </view>
    <view class="tr">
      <view class="td-1" selectable="true" wx:if="{{receiveOrder.businessType=='散货'}}">品名</view>
      <view class="td-1" selectable="true" wx:else>箱型</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.boxType}}</view></view>
    </view> 
    <view class="tr">
    <view class="td-1" selectable="true" wx:if="{{receiveOrder.businessType=='散货'}}">货重</view>
      <view class="td-1" selectable="true" wx:else>箱重</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.weight}}</view></view>
    </view>
    <view class="tr">
    <view class="td-1" selectable="true" wx:if="{{receiveOrder.businessType=='散货'}}">装货地址</view>
      <view class="td-1" selectable="true" wx:else>门点</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.store}}</view></view>
    </view>
    <view class="tr">
     <view class="td-1" selectable="true" wx:if="{{receiveOrder.businessType=='散货'}}">卸货地址</view>
      <view class="td-1" selectable="true" wx:else>港区</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.harbour}}</view></view>
    </view>
    <view class="tr">
     <view class="td-1" selectable="true" wx:if="{{receiveOrder.businessType=='散货'}}">包装</view>
      <view class="td-1" selectable="true" wx:else>提箱点</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.fetchAddress}}</view></view>
    </view>
    <view class="tr" wx:if="{{receiveOrder.businessType!=='散货'}}">
      <view class="td-1" selectable="true">进出口</view>
      <view class="td-2" selectable="true"><view><view class='td-border'>{{receiveOrder.cargoType=="import"?'进口':'出口'}}</view></view></view>
    </view>
    <view class="tr">
      <view class="td-1" selectable="true">支付方式</view>
      <view class="td-2" selectable="true"><view><view class='td-border'>{{receiveOrder.payType== 'online' ? '平台垫付' : '线下结算'}}</view></view></view>
    </view>
     <view class="tr">
      <view class="td-1" selectable="true">运费</view>
      <view class="td-2" selectable="true"><view>{{receiveOrder.freight}}</view></view>
    </view>
     <view class="tr">
      <view class="td-1" selectable="true">留言</view>
      <view class="td-4" selectable="true"><view>{{receiveOrder.message}}</view></view>
    </view> </view>
</view>
</template>

 在需要的页面引用

<import src="../template/list.wxml"/>
<template is="listNone" data="{{receiveOrder}}"></template>

如果一个页面有很多相同的重复代码,或者,多个页面有相同的重复代码,使用模板就方便多了

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值