Question

由于某种原因，我的VSCode用红色突出显示了过渡元素，这意味着它无法识别该元素。我不太确定这是怎么回事。而且该代码也不起作用，因为单击按钮根本没有过渡，甚至没有任何更改。感谢您的帮助！

<!--Vuejs CDN-->
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>

<title>Hello, world!</title>   </head>   <body>
<div id='app'>
  <button v-on:click='showThis = !showThis'>Swap</button>
  <transition name='fade'>
    <p v-if='showThis'>Then showThis is true!</p>
  </transition>
</div>

<!-- Vuejs -->
<script>
  new Vue({
    el:'#app',
    data:{
      showThis:true
    }
  })
</script>

<style>
.fade-enter-active, .fade-leave-active {
  transition: opacity .5s;
}
.fade-enter, .fade-leave-to {
  opacity: 0;
}
</style>

<!-- Optional JavaScript -->
<!-- jQuery first, then Popper.js, then Bootstrap JS -->
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"

crossorigin =“ anonymous”>

Answer 1

只需在用户设置中添加以下几行进行检查。文件->首选项->设置->用户设置

“ editor.formatOnSave”：是的， “ eslint.validate”：[ “ javascript”， “ javascriptreact”， “ vue” ]

Answer 2

我相信您的标签只是一个结束标签。尝试创建<head></head>打开和关闭对。

VSCode无法识别<transition>元素

2 个答案: