本来是在学习事件修饰符
实操时发现如这样的写法是无法触发father节点的click事件的：
<body>
<div id="father" @click="alertFather" >
father
<div id="son" @click="alertChild">
son
</div>
</div>
<script>
const msg={
methods: {
alertChild(){
alert("child")
},
alertFather(){
alert("Father")
}
}
}
Vue.createApp(msg).mount("#father")
</script>
</body>
点击外层没有触发事件，点击内层只会调用一次alertChild。
打开控制台发现<div id="father" @click="alertFather" >并没有被vue渲染
假如我再嵌套一层div，将外层的click事件放在中间层的div上，就可以正常运行：
<body>
<div id="father" >
<div @click="alertFather">
father
<div id="son" @click="alertChild">
son
</div>
</div>
</div>
<script>
const msg={
methods: {
alertChild(){
alert("child")
},
alertFather(){
alert("Father")
}
}
}
Vue.createApp(msg).mount("#father")
</script>
</body>
似乎不能再挂载点添加事件，这是为什么？
