在 VueJs 中使用 element-ui 时，如何在控制台中消除此错误 "Computed property validateState was assigned to but it has no setter"

Question

我目前在 Vue Js 项目中使用 element-ui 版本 2.14.1。我只按需导入 element-ui 此处 https://element.eleme.io/#/en-US/component/quickstart 推荐的 select 组件。在我使用 select 组件的每个组件中，我在控制台中收到此错误

[Vue warn]: Computed property "validateState" was assigned to but it has no setter.

found in

---> <ElInput> at packages/input/src/input.vue
      <ElSelect> at packages/select/src/select.vue

有谁知道导致此错误的原因以及我该如何解决它。这真的很令人沮丧。如果需要，我可以提供更多信息。提前谢谢你。

如有人要求提供更多详细信息，在 main.js 我有

import lang from "element-ui/lib/locale/lang/en";
import locale from "element-ui/lib/locale";
locale.use(lang);

import { Option, Select, } from "element-ui";

Vue.use(Option);
Vue.use(Select);

虽然在我的组件中我有

<template>
  <div class="route-start">
    <div>
      <p class="text-secondary-orange font-semibold mb-3">Start</p>
    </div>
    <div class="state">
      <label class="label">State</label>

      <el-select filterable v-model="selectedState" placeholder="Select">
        <el-option
          v-for="state in states"
          :key="state.id"
          :label="state.name"
          :value="state.id"
        >
        </el-option>
      </el-select>
    </div>
   </div>
</template>

然后在脚本部分我有

export default {
  data() {
    return {
      selectedState: "",
      isLastMile: "",
      states: []
    };
  },
}

Answer 1

如以下 link 中的文档所述：

Computed properties are by default getter-only, but you can also provide a setter when you need it

Computed setter vue documentation

所以这意味着计算属性通常用于 return 基于其他值的值，我们在模板中使用计算值。也可以为计算值赋值，如果这样做，您需要在计算值中定义 setter。

从你得到的错误来看，我猜你在代码中的某个地方有意或无意地为计算赋值，但你的计算没有 setter。通过将 setter 添加到您的计算中，您可以解决此错误。

阅读上面link中的文档，里面有很好的例子，有什么不明白的地方可以问。

在 VueJs 中使用 element-ui 时，如何在控制台中消除此错误 "Computed property validateState was assigned to but it has no setter"

How do I get rid of this error "Computed property validateState was assigned to but it has no setter" in the console while using element-ui with VueJs

javascript

vue.js

element-ui