主要思路是三元运算符的运用；

先来看一下效果，做了2个小demo；

demo1

demo1

demo2

demo2

demo1的实现：
WXML

<view bindtap="dj">{{xs?'true状态':'flase状态'}}</view>

JS:

Page({
    data: {
        xs: true
    },
    
    
    dj: function () {
        this.setData({
            xs: (!this.data.xs)
        })
       }
})

demo2的实现：（部分代码）

WXML:

<view class='btn-btm'>
    <view class=''>答题指导：根据最近三个月的情况选择</view>
    <view class='btn-box'  bindtap='alert'>
    <view class='btn-trangle'></view>
    </view>
</view>


<!-- 隐藏的内容 -->
<view class='bg' style='display:{{hide ? "none":""}}'>
    <view class='content'>
        <view class='li'><text class='bg-title'>没有：</text><text>从来没有过</text></view>
        <view class='li'><text class='bg-title'>没有：</text><text>从来没有过</text></view>
        <view class='li'><text class='bg-title'>没有：</text><text>从来没有过</text></view>
        <view class='li'><text class='bg-title'>没有：</text><text>从来没有过</text></view>
        <view class='li'><text class='bg-title'>没有：</text><text>从来没有过</text></view>
    </view>
</view>

JS:

// pages/data/me-test.js
Page({

    data: {
        hide: true, 
    },
        alert: function () {
            console.log("ss");
            this.setData({
                hide: (!this.data.hide)  
               }) 
    }, 
})

剩余的CSS代码就不写了，知道这个思路就行。
周六放假，现在下班了，溜了溜了，哈哈哈