Hi i want to ask about editor in native component like in this demo Link
so i have 2 problem so far when implementing editor.
first question is when i set value in v-model and load page, i can get value after load finish but i cant type anything in editor
this is my setup code :
<Editor
ref="editor"
:tools="tools"
@blur="saveResumePI('draft');setValueEditor()"
v-model="candData.mem_about_me"
/>
second question is that popup tools css like insert image or insert code looks broken when i open it
i upload screenshot for your reference about my second question
you can ask more detail if my question is confusing
thanks
Hi, Kenji.
Can you please share the versions of the Native Editor and the Kendo Theme that you use in your project? Also do you use Vue 2 or Vue 3?
Hi Petar,
installed list in package.json
Hi, Kenji.
Thank you for the shared package.json definition. Based on it, I could say that updating the version of the Kendo Bootstrap Theme should resolve the issue.
With the shared definition, once the packages with version ^3.x.x are installed, the version of the Kendo UI for Vue Native packages that will be installed is 3.8.3(the current latest version). On its side, the 3.8.3 version of the Native packages require version 6.x.x of the Kendo UI for Vue Theme loaded to your project. In the current scenario, the latest version of the Kendo Bootstrap Theme is 6.1.0.
To summarize the above, what I can recommend is to:
"@progress/kendo-vue-animation": "^3.7.3", "@progress/kendo-vue-common": "^3.7.3", "@progress/kendo-vue-data-tools": "^3.7.1", "@progress/kendo-vue-dateinputs": "^3.7.1", "@progress/kendo-vue-dialogs": "^3.7.1", "@progress/kendo-vue-dropdowns": "^3.7.1", "@progress/kendo-vue-editor": "^3.8.0", "@progress/kendo-vue-form": "^3.8.0", "@progress/kendo-vue-grid": "^3.7.1", "@progress/kendo-vue-indicators": "^3.6.4", "@progress/kendo-vue-inputs": "^3.7.1", "@progress/kendo-vue-intl": "^3.7.1", "@progress/kendo-vue-layout": "^3.7.3", "@progress/kendo-vue-pdf": "^3.8.0", "@progress/kendo-vue-progressbars": "^3.7.3", "@progress/kendo-vue-upload": "^3.7.3",
After applying the above changes, delete the package-lock.json file of your project, run "npm install" to re-install the packages, and test again the Kendo UI for Vue Native Editor.
Please try the above suggestions and let me know if you need furhter assistance with the implementation of your scenario.
my second question is fix using your method but my first question still exist
i set editor value using v-model and success to get data from API but i cant type anything in editor if using v-model
is there any reference how to get data from API and show it in editor?
Hi, Kenji.
It is my miss that I didn't address the v-model question. The Kendo UI for Vue Native Editor doesn't have the v-model binding option implemented for it. Here is a link to the feature request about this functionality. You can vote for it. The more votes it collects, the bigger the chance for its sooner implementation to be.
With the current implementation of the Native Editor, to update the value of the component, you can use the approach demonstrated in this "Controlling the value" demo that uses the value prop and the change event.
I hope the above addresses all your questions. Please let me know if you need additional details about the discussed functioanlity.
it works and thanks for your help