[Uniapp、Vue] 親要素のイベントが子要素のイベントをオーバーライドできないようにする

次のコードに示すように、要素をクリックしてポップアップ ボックスを表示し、ポップアップ ボックスの外側の領域をクリックしてポップアップ ボックスを閉じる必要があります。
しかし、これには問題があります。つまり、ポップアップ ボックスが表示されているときに、ポップアップ ボックスの領域をクリックすると、親要素のクリック イベントもトリガーされてしまいます。ifshow=false

<view @click="ifshow=false">
	<view @click="ifshow=true">
		点击显示弹出框
	</view>
	<view v-if="ifshow">
		弹出框
	</view>
</view>

ここに画像の説明を挿入

解決策: サブコンポーネントのイベントに変更を追加するstopと、親イベントと子イベントが互いに分離されます。

<view @click="ifshow=false">
	<view @click.stop="ifshow=true">
		点击显示弹出框
	</view>
	<view v-if="ifshow">
		弹出框
	</view>
</view>

ここに画像の説明を挿入

おすすめ

転載: blog.csdn.net/SingDanceRapBall/article/details/131867926