There is a requirement. Click an element to display the pop-up box, and click an area outside the pop-up box to close the pop-up box, as shown in the following code.
But there is a problem with this, that is, when the pop-up box is displayed, clicking the area of the pop-up box will also trigger the click event of the parent element, makingifshow=false
<view @click="ifshow=false">
<view @click="ifshow=true">
点击显示弹出框
</view>
<view v-if="ifshow">
弹出框
</view>
</view>
Solution: Add a modification to the subcomponent event stop
, and the parent and child events will be isolated from each other
<view @click="ifshow=false">
<view @click.stop="ifshow=true">
点击显示弹出框
</view>
<view v-if="ifshow">
弹出框
</view>
</view>