uni-app在小程序中v-show指令失效

用uni-app寫了一段發送驗證碼的代碼

<view class="cu-form-group">
<view class="title">驗證碼</view>
<input placeholder="請輸入驗證碼" name="input" v-model="code"></input>
<button class='cu-btn bg-green shadow' v-show:="show '" @click="getCode">發送</button>
<button class='cu-btn line-grey shadow' v-show:="!show'">{{count}}s</button>
</view>

在瀏覽器中能夠正常運行，改成在支付寶小程序模擬器中跑了一遍，發現v-show指令失效，第二個button也顯示出來了

於是改用:style

<view class="cu-form-group">
<view class="title">驗證碼</view>
<input placeholder="請輸入驗證碼" name="input" v-model="code"></input>
<button class='cu-btn bg-green shadow' :style="show ? '' : 'display:none;'" @click="getCode">發送</button>
<button class='cu-btn line-grey shadow' :style="!show ? '' : 'display:none;'">{{count}}s</button>
</view>

當然這里也可以使用 :class 應該也能達到一樣的效果

附上我的methods

 

methods: {
getCode() {
const TIME_COUNT = 60;      
if (!this.timer) {        
this.count = TIME_COUNT;        
this.show = false;        
this.timer = setInterval(() => {        
if (this.count > 0 && this.count <= TIME_COUNT) {          
this.count--;         
} else {          
this.show = true;          
clearInterval(this.timer);          
this.timer = null;         
}        
}, 1000)       
}    
}

}

可以拿去直接用