如何在VUE中固定Quill中的prop值
我想为我的Quill Text Editor设置默认值,然后将Props发送给名为DefaultValue的组件:
props: { defaultValue: "",
},
我像这样创建了我的文本编辑器:
<div class="form-control" v-bind:class="inputClasses" ref="editor">/div>
mounted() {
var _this = this;
this.editor = new Quill(this.$refs.editor, {
modules: {
toolbar: [
[{ header: [1, 2, 3, 4, false]} ],
["bold", "italic", "underline", "link", "image"],
],
},
//theme: 'bubble',
theme: "snow",
formats: ["bold", "underline", "header", "italic", "link"],
placeholder: this.placeholder
});
this.editor.root.innerHTML = this.defaultValue;
this.editor.setText(this.defaultValue);
this.editor.on("text-change", function () {
return _this.update();
});
},
methods: {
update: function update() {
this.$emit(
"update:modelValue",
this.editor.getText() ? this.editor.root.innerHTML : ""
);
},
},
但是this.editor.settext(this.defaultValue);值是未定义的,我会收到这样的警告:属性在渲染过程中访问了“错误”,但并未定义。 at&lt; texteditor label =“ description” modelValue = undefined onupdate:modelValue = fn ...&gt;
我几乎尝试了所有解决此问题的一切,但我仍然没有成功。
I want to set a default value for my Quill text editor and I am sending props to my component named defaultValue:
props: { defaultValue: "",
},
and I created my text editor like this:
<div class="form-control" v-bind:class="inputClasses" ref="editor">/div>
mounted() {
var _this = this;
this.editor = new Quill(this.$refs.editor, {
modules: {
toolbar: [
[{ header: [1, 2, 3, 4, false]} ],
["bold", "italic", "underline", "link", "image"],
],
},
//theme: 'bubble',
theme: "snow",
formats: ["bold", "underline", "header", "italic", "link"],
placeholder: this.placeholder
});
this.editor.root.innerHTML = this.defaultValue;
this.editor.setText(this.defaultValue);
this.editor.on("text-change", function () {
return _this.update();
});
},
methods: {
update: function update() {
this.$emit(
"update:modelValue",
this.editor.getText() ? this.editor.root.innerHTML : ""
);
},
},
But this.editor.setText(this.defaultValue); value comes undefined and I get warning like this: Property "error" was accessed during render but is not defined on instance.
at <TextEditor label="Description" modelValue=undefined onUpdate:modelValue=fn ... >
I almost tried everything to solve this issue but still I am not successful.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
![扫码二维码加入Web技术交流群](/public/img/jiaqun_03.jpg)
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论