vue出现$attrs is readonly的报错原因

这是因为在Vue.js的父子组件传递属性时，如果使用了v-bind或者具有v-bind的简写“:”时，传递的属性会存储在$attrs对象中，而这个对象是只读的，无法直接修改。可能的解决方法是在子组件中使用v-bind="$attrs"将所有属性绑定到子组件的根DOM元素上，或者使用v-model来双向绑定属性。

相关问题

Vue中报$attrs is readonly

在Vue中，$attrs是一个只读属性，它用于接收父组件传递给子组件的非props属性。因此，您无法直接更改$attrs中的属性值。

如果您想更改这些属性值，可以考虑使用v-bind指令将它们绑定到组件实例的一个变量上，然后在组件内部使用这个变量进行更改。

例如：

<template>
  <div>
    <input v-bind="$attrs" v-model="inputValue"/>
  </div>
</template>

<script>
export default {
  data() {
    return {
      inputValue: ''
    }
  }
}
</script>

在上面的示例中，我们使用v-bind指令将$attrs绑定到input元素上，然后在组件内部使用一个data属性inputValue来保存用户输入的值。这样，我们就可以在组件内部更改这个值而不会影响到$attrs中的属性值。

vue 使用wangeditor $attrs is readonly.

在Vue中，$attrs是一个只读属性，它用于获取父组件传递给子组件的非props属性。$attrs主要用于在子组件中将传递给它的所有属性传递给其他子组件或者原生HTML元素。它的只读属性意味着我们不能直接对其进行修改。

使用wangeditor插件时，我们可能会将其作为一个子组件来使用。当我们想要将$attrs传递给wangeditor组件时，我们不能直接修改$attrs。我们可以通过创建一个新的变量，将$attrs的值复制给这个变量，然后再将该变量传递给wangeditor组件。

例如，我们可以在父组件中创建一个名为editorAttrs的变量，并将$attrs的值复制给它：

<template>
  <wangeditor :attrs="editorAttrs"></wangeditor>
</template>

<script>
export default {
  data() {
    return {
      editorAttrs: {},
    };
  },
  mounted() {
    this.editorAttrs = this.$attrs; // 将$attrs的值复制给editorAttrs
  },
};
</script>

通过这种方式，在wangeditor组件中，我们可以获取到父组件传递给editorAttrs的所有属性。需要注意的是，我们只能通过此方法将$attrs传递给wangeditor组件，并且我们不能对editorAttrs进行直接修改。