vue中点击父容器不触发子容器

这里用的就是修饰符.stop阻止事件冒泡和捕获
@click.stop="gameTipsDialog === true"这里填一个空的方法也是可以的
还有一个办法就是让两个.stop的容器通过定位达到不是父子关系也是可以的

 <view v-if="gameTipsDialog" class="game-tips-dialog" @click.stop="closeDialog">
            <view class="game-start-tips-wrap" @click.stop="gameTipsDialog === true">
                <view class="tips-title">游戏消耗提示</view>
                <view class="tips-content">确认消耗<text class="integral-num">{{ gameInfo.consumeIntegral ? gameInfo.consumeIntegral : 0}}</text>积分参与拍一拍游戏？</view>
                <view class="game-tips-wrap">
                    <view class="back-btn" @click.stop="cancelGame">不用了</view>
                    <view class="confirm-btn" @click.stop="confirmGame">立即拍</view>
                </view>
            </view>
        </view>

closeDialog() {
       this.gameTipsDialog = false;
 },

参考链接Vue中常用的修饰符

preventDefault()、 preventDefault()和 return false 的区别