修改fontSize引发一个错误- TypeError："fontSize“是只读的

Question

我有一个Vue.js应用程序。在我的组件中，我希望确保div中的文本符合其内容。下面是我的mounted钩子中的逻辑：

  mounted() {
    const front = this.$refs.frontContainer;
    const subject = this.$refs.subjectContainer;
    const fontSize = 1.1;
    while (front.offsetHeight < front.scrollHeight) {
      fontSize -= 0.05;
      subject.style.fontSize = fontSize + 'em';
    }
  }

模板(简化)如下：

<template>
<div class="front-data" ref="frontContainer">
  <span ref="subjectContainer" class="subject">{{ event.subject }}</span>
</div>
</template>

无论何时加载页面，我都会看到以下错误：

Vue警告:挂载钩子中的错误："TypeError："fontSize“是只读的”TypeError："fontSize“是只读的

为什么不动呢？我在W3C上发现，我应该能够设置fontSize。

Answer 1

如果您正在修改值，则使用let而不是const

let fontSize = 1.1;