点击关闭再点击显示的功能应该用什么去写，大神解答下！！

你有试过吗，你这样写效果一次都出不来

2L正解

!是逻辑运算符。当index为true时，!index为false；当index为false时，!index为true。

运行屏幕截图

<view class=“{{index == true ?‘hide’:‘present’}}”

引号的问题，这样就可以了

index=="true"与 !index    有什么却别 ， 为什么我写的效果就出不来，！index这个请解释下

出不来？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;

}

//index.js

//获取应用实例

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>

已经测试过，能正常运行。

你可以试试用条件渲染

this.setData=({index:‘fales’})

这句写错了吧，怎么多个=号出来？删掉就正常了