代码如下:
/----------wxml------------/
<view class=“container”>
<button bindtap=“change” >点击切换</button>
<view class=’{{index==“true”?“hide”:“present”}}’ style=“background-color:red;width:200rpx;height:200rpx;margin:20px 0 30px 0;”></view>
/-----------wxss-----------/
.hide{display:none}
.present{display:block}
/-----------js---------------/
var app = getApp()
Page({
data: {
index:‘false’
},
change:function(e){
if(this.data.index==‘false’){
this.setData({index:‘true’})
}else{
console.log(this.data.index);
this.setData({index:‘false’})
}
}
})
截图:
一、刷新
二、点击关毕
三、再点击就出不来?怎么回事,求教大神
出不来?var d=e.detail.value取到的是boolean型,true是boolean型的值,"true"是字符串,先搞清楚些
效果:
<!–index.wxml–>
<view class=“container”>
<switch type=“switch” bindchange=“change” style=“margin-top:20px;” />
<view class=’{{index == true?“hide”:“present”}}’
style=“background-color:red;width:200rpx;height:200rpx;margin-top:20px;”></view>
</view>
/**index.wxss**/
.hide {
display: none;
}
.present {
display: block;
}
//获取应用实例
var app = getApp()
Page({
data: {
index: false,//用不着引号
},
//事件处理函数
change: function (e) {
var d = e.detail.value;
console.log(d);
if (this.data.index ) {//也不用==“false”
this.setData({ index: d })
} else {
this.setData({ index: d })
}; console.log(this.data.index);
},
onLoad: function () {
}
})
/------------------js--------------------/
var app = getApp()
Page({
data: {
index: false,
},
change: function (e) {
var d = e.detail.value;
this.setData({ index: d })
}
})
/----------------wxml-----------------/
<view class=’{{!index?“hide”:“present”}}’ style=“background-color:red;width:200rpx;height:200rpx;margin-top:20px;”></view>
已经测试过,能正常运行。