即根据js文件确定的变量值,决定显示内容与格式。这方面与 discuz 的运行模式是一样的。
首先修改模板的 index.js 文件:
//index.js
//获取应用实例
const app = getApp()
Page({
data: {
boolean: false
},
//事件处理函数
EventHandle: function(){
var bool = this.data.boolean;
this.setData({
boolean: !bool
})
console.log("boolean:" + this.data.boolean)
},
bindViewTap: function() {
wx.navigateTo({
url: '../logs/logs'
})
},
onLoad: function () {
}
})
index.wxml:
<!--index.wxml-->
<view class="container">
<view bindtap='EventHandle'>点击</view>
<view wx:if="{{boolean==true}}">
<view class='bg_black'>青青园中葵,朝露待日晞。</view>
</view>
<view wx:elif="{{boolean==false}}">
<view class='bg_red'>阳春布德泽,万物生光辉。</view>
</view>
</view>
index.wxss:
/**index.wxss**/
.bg_black{
height: 200px;
background-color: rgb(157, 231, 185)
}
.bg_red{
height: 200px;
background-color: rgb(252, 182, 182)
}
|
请发表评论