Vue 3 在标签中保留空类属性答案

【问题标题】：Vue 3 keeps empty class attribute in tagVue 3 在标签中保留空类属性
【发布时间】：2021-10-24 12:10:34
【问题描述】：

我在我的页面上使用 vue3 作为响应式内容（没有 node-js，没有路由器，什么都没有，只有 <script src="vue.js"> 和内联模板。所以我对类绑定有疑问

const app = Vue.createApp({});
console.log("Vue version:", app.version);
app.component('application', {
  data() {
    return {
      isActive: false,
    }
  },
  template: '#application'
});

app.mount('#app');

<script src="https://unpkg.com/vue@next"></script>
<script type="text/html" id="application">
  <div :class='{"someClass": isActive}'>some text</div>
  <div :class='[isActive ? "someClass" : ""]'>none class</div>
  <div :class='[isActive ? "someClass" : null]'>null class</div>
  <div :class='[isActive ? "someClass" : undefined]'>undef class</div>
</script>
<div id="app">
  <application></application>
</div>

所以当它渲染时，它总是保持类属性（渲染元素），即使我在这里放 none/null，

<div class>some text</div>
<div class>none class</div>
<div class>null class</div>
<div class>undef class</div>

我找到了一些例子，但我猜它只适用于带有空参数的 vue 2

这不是一个大问题，因为它不会对 DOM 元素和结构造成任何问题，但它确实让我内心的某个地方非常恼火。

【问题讨论】：

标签： javascript html vue.js vuejs3

【解决方案1】：

Vue 3 中的 minor issue 应该已经修复但不是...

当/如果上述问题将得到妥善解决，class 属性应在值为 null 时删除（如 Vue 2 中的情况）

【讨论】：