小程序学习笔记2
逻辑判断
test.html
<view wx:if="{{bool}}">条件渲染显示</view>
tset.js
Page({
data:{
bool:true,
},
show:function(){
this.setData({
bool:!this.data.bool,
})
},
})
页面数字计算
test.wxml
<view>{{3*55}}</view> <view>{{"hello"+array[0]}}</view>
字符串链接
test.wxml
<view>{{"hello"+array[0]}}</view>
使用模板
test.wxml
<!-- 定义一个模板 --> <template name="msgItem"> <view> <text> {{index}}: {{msg}} </text> <text> Time: {{time}} </text> </view> </template>
<!-- 使用这个模板 -->
<template is="msgItem" data="{{...ite2}}"/>
test.js
Page({
data:{
ite2: {
index: 0,
msg: 'this is a template!!!',
time: '2016-09-15'
}
},
})
引用
import
test.wxml
<import src="../item/item.wxml"/> <template is="item" data="{{text: 'forbar'}}"/>
item.wxml
<!--pages/item/item.wxml--> <text>pages/item/item.wxml</text> <!-- item.wxml --> <template name="item"> <text>{{text}}</text> </template>
则最后输出的是
forbar
include
test.xml
<include src="../item/c.wxml"/>
c.wxml
<!--pages/item/c.wxml--> <text>pages/item/c.wxml</text> <template name="c"> <text>这个是c.wxml</text> </template>
则最后输出:
pages/item/c.wxml
import和include的区别:
import 有作用域的概念,即只会 import 目标文件中定义的 template,而不会 import 目标文件 import 的 template。include
可以将目标文件除了<template/>
的整个代码引入,相当于是拷贝到include
位置。
你的指尖,有着改变世界的力量!