- ### WXML提供模板(template),可以在模板中定义代码片段,然后在不同的地方调用
~~~
//定义模板
<template name="temp">
<view>
<view>收件人:{{name}}</view>
<view>联系方式:{{phone}}</view>
</view>
</template>
//is使用模板
<template is="temp" data ="{{...item}}">
</template>
~~~
is 属性可以使用 Mustache 语法,来动态决定具体需要渲染哪个模板:
~~~
<template name="odd">
<view> odd </view>
</template>
<template name="even">
<view> even </view>
</template>
<block wx:for="{{[1, 2, 3, 4, 5]}}">
<template is="{{item % 2 == 0 ? 'even' : 'odd'}}"/>
</block>
~~~
- ### 引用
WXML 提供两种文件引用方式`import`和`include`。
- import 只引入template模板
在 `item.wxml` 中定义了一个叫item的template
~~~
<!-- item.wxml -->
<template name="item">
<text>{{text}}</text>
</template>
~~~
在`index.wxml`中引入
~~~
<import src="item.wxml"/>
<template is="item" data="{{text: 'forbar'}}"/>
~~~
- include
include 可以将目标文件除了[template,wxs]() 外的整个代码引入,相当于是拷贝到 include 位置
~~~
<!-- index.wxml -->
<include src="header.wxml"/>
<view> body </view>
<include src="footer.wxml"/>
~~~
~~~
<!-- header.wxml -->
<view> header </view>
~~~
~~~
<!-- footer.wxml -->
<view> footer </view>
~~~
- 0.豆瓣接口文档
- 1.开发环境配置
- 2.hello world
- 3.wxml语法
- 第一节 数据绑定
- 第二节 列表渲染
- 第三节 条件渲染
- 第四节 模板引用
- 第五节 事件
- 第6节 轮播
- 第7节 skill
- 第8节 小程序接口调用
- 第9节 获取自定义的属性值
- 4.wxs
- 5.小程序的运行机制及框架
- 6.生命周期
- 7.小程序api
- 第1节 调用缓存
- 第2节 弹出框
- 第3节 模态框
- 第4节 分享showActionSheet
- 第5节 音乐播放
- 第6节 定义全局的数据
- 第7节 target
- 第8节 previewImage
- 第9节 用户授权-获取用户信息
- 第10节 判断用户是否授权
- 8.组件
- 第1节 toolbar的配置
- 第2节 动态设置导航
- 第3节 数据加载loading
- 第4节 下拉刷新
- 第5节 地图
- 第6节 component
- 第7节 scroll-view
- 第8节 form搜索
- 第9节 自定义事件的激活与监听
- 第10节 自定义组件
- 1.属性值改变时会触发observer函数
- 2.组件的behaviors属性可以将组件公共部部分抽离
- 第11节 slot
- 12 向组件传递外部样式
- 13wxs
- 1.写在wxml中的wxs
- 第14open-data
- 第15节 自定义button-slot实现授权组件
- 实例
- B.项目实战
- 第一章 发送http请求
- 第1节 豆瓣调用限定数据的数据
- 第二章 可用的豆瓣接口
- 第三章 处理豆瓣列表页的数据
- 第四章 电影更多页面的数据加载
- 9.skill
- 第一节 e6解决this指向
- 第二节 使用class封装一个简单的http
- 第1点 封装一个带错误的http
- 第2点 使用models再次封装http
- 第三节 http状态码
- 第四节 回调函数
- 第五节 小程序组件wx:if会触发detached,hidden不会
- 第六节 使用promise封装http
- 1.使用models再次封装http
- 第七节 增加历史数据到缓存中
- 第八节 Page向子组件传递上拉下拉
- 第九节 async,await语法支持