From: Evan You <yyx990803@gmail.com>
Date: Mon, 29 Mar 2021 20:06:14 +0000 (-0400)
Subject: workflow(sfc-playground): make warnings dismissable
X-Git-Tag: v3.0.10~21
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=4d9f9fdf9d3194a32ca3d1719df809b90b56e2d3;p=thirdparty%2Fvuejs%2Fcore.git

workflow(sfc-playground): make warnings dismissable
---

diff --git a/packages/sfc-playground/src/Message.vue b/packages/sfc-playground/src/Message.vue
index 7cc2399555..828f6b2cd3 100644
--- a/packages/sfc-playground/src/Message.vue
+++ b/packages/sfc-playground/src/Message.vue
@@ -1,16 +1,23 @@
 <template>
   <Transition name="fade">
-    <pre v-if="err || warn"
+    <pre v-if="!dismissed && (err || warn)"
       class="msg"
-      :class="err ? 'err' : 'warn'">{{ formatMessage(err || warn) }}</pre>
+      :class="err ? 'err' : 'warn'"
+      @click="dismissed = true">{{ formatMessage(err || warn) }}</pre>
   </Transition>
 </template>
 
 <script setup lang="ts">
-import { defineProps } from 'vue'
+import { defineProps, ref, watch } from 'vue'
 import type { CompilerError } from '@vue/compiler-sfc'
 
-defineProps(['err', 'warn'])
+const props = defineProps(['err', 'warn'])
+
+const dismissed = ref(false)
+
+watch(() => [props.err, props.warn], () => {
+  dismissed.value = false
+})
 
 function formatMessage(err: string | Error): string {
   if (typeof err === 'string') {