点击页面控制显示与隐藏
时间: 2023-09-30 10:03:27 浏览: 41
要在 Uniapp 中实现点击页面控制显示与隐藏,可以使用 `v-if` 或 `v-show` 指令。
首先,在需要控制显示与隐藏的元素上,使用 `v-if` 或 `v-show` 指令:
```vue
<template>
<view>
<button @click="toggleShow">点击切换显示状态</button>
<view v-if="show">显示的内容</view>
</view>
</template>
```
```javascript
export default {
data() {
return {
show: false
}
},
methods: {
toggleShow() {
this.show = !this.show
}
}
}
```
或者使用 `v-show` 指令:
```vue
<template>
<view>
<button @click="toggleShow">点击切换显示状态</button>
<view v-show="show">显示的内容</view>
</view>
</template>
```
```javascript
export default {
data() {
return {
show: false
}
},
methods: {
toggleShow() {
this.show = !this.show
}
}
}
```
以上是使用 `v-if` 或 `v-show` 指令实现点击页面控制显示与隐藏的方法。