vue reactivity.esm-bundler.js:1106 Write operation failed: computed value is readonly

js 代码

const props = defineProps({
  value: String
})

组件调用

  <el-autocomplete
      v-model="value"
      :value-key="key||'title'"
      :fetch-suggestions="querySearchAsync"
      placeholder="Please input"
      @select="handleSelect"
  />
</template>

Vue 语法糖中，使用defineProps时是不能进行修改的。

如果需要进行双向绑定，可以使用以下方法：

const props = defineProps({
  value: String
})
const selectValue = ref(props.value+"")//注意+""空字符串，这样就不会对props中的值产生绑定

<el-autocomplete
    v-model="selectValue"
    :value-key="key||'title'"
    :fetch-suggestions="querySearchAsync"
    placeholder="Please input"
    @select="handleSelect"
/>