Vue.js 模板编译错误: (Emitted value instead of an instance of Error) - i-rate 组件 value 绑定错误

Vue.js 模板编译错误: (Emitted value instead of an instance of Error) - i-rate 组件 value 绑定错误

代码中的错误在于使用了错误的语法来绑定 i-rate 组件的 value 属性。应该使用 v-model 指令来绑定 value 属性，而不是使用双括号语法。

错误代码:

<i-rate :change="goodsChange" value="{{starIndex1}}"></i-rate>
<i-rate :change="deliverChange" value="{{starIndex2}}"></i-rate>
<i-rate :change="serviceChange" value="{{starIndex3}}"></i-rate>

正确代码:

<i-rate :change="goodsChange" v-model="starIndex1"></i-rate>
<i-rate :change="deliverChange" v-model="starIndex2"></i-rate>
<i-rate :change="serviceChange" v-model="starIndex3"></i-rate>

原因:

双括号语法 {{ }} 用于插值，它会将表达式求值并将其结果插入到模板中。而 v-model 指令则用于双向绑定，它将元素的值与数据属性同步。在 i-rate 组件中，value 属性用于指定初始评分，而 v-model 用于在用户交互时更新评分。

总结:

当遇到 (Emitted value instead of an instance of Error) 错误时，需要检查模板中是否使用了错误的语法来绑定组件属性。对于需要双向绑定的属性，建议使用 v-model 指令，而不是双括号语法。