@click.stop: used to prevent bubbling
Within the scope of the @click.stop tag, clicking on any area (including the @click click event) will not close the pop-up window. The pop-up window will be closed outside the tag range.
@click.stop @click and other events in the tag: If there is code to close the pop-up window in the event, the pop-up window can be closed
in template
<view class="pop-box" v-if="showPop" @touchmove.stop.prevent="toMoveHandle" @click="showPop = false">
<view @click.stop>
弹窗内容
</view>
</view>
<view @click="showPop = true">打开弹窗</view>
in script
data() {
return {
showPop: false,
}
}
Please view the toMoveHandle method: uniapp prohibits page scrolling under the mask layer
in style
.pop-box {
position: fixed;
top: 0;
left: 0;
right: 0;
bottom: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.4);
z-index: 999;
}