美文网首页
Weixin Wxml

Weixin Wxml

作者: 喵王不瞌睡 | 来源:发表于2018-09-19 14:06 被阅读0次

标签

<view class='box-item'></view>
<!-- 基础块相当于div -->

<block>
    <view class='box-header'></view>
    <view class='box-body'></view>
</block>
<!-- 相当于一组view -->

循环,判断

<!-- wx:for -->
<view class='box'>
  <view class='box-item' wx:for="{{lists}}" wx:for-index="index" wx:for-item="item">
    <text>[{{index}}] : "name" : {{item.name}}</text>
  </view>
</view>

<!-- wx:if -->
<view wx:if="{{number > 5}}"> 1 </view>
<view wx:elif="{{number > 2}}"> 2 </view>
<view wx:else> 3 </view>

模板

<template name="newItem">
  <view class="new-item">
    <text> {{title}} </text>
    <text> {{time}} </text>
  </view>
</template>

<block wx:for="{{newLists}}" wx:for-item="new">
<template is="newItem" data="{{...new}}"/>
</block>
Page({
  data: {
    newLists:[
      {title:'china',time:'2018'},
      {title:'america',time: '2019' },
    ]
  }
})

引入

<import src="../templates/new-item.wxml"/>

<block wx:for="{{newLists}}" wx:for-item="new">
<template is="newItem" data="{{...new}}"/>
</block>

<!-- include 可以将目标文件除了 <template/> <wxs/> 外的整个代码引入,相当于是拷贝到 include 位置 -->
<include src="../layouts/footer.wxml"/>

相关文章

网友评论

      本文标题:Weixin Wxml

      本文链接:https://www.haomeiwen.com/subject/bklinftx.html