مشکل در لود کردن فانکشن در زیر لایه then

با درود خدمت دوستان گرامی من یک فانکشن دارم که در حقیقت api مربوط LiveView فریم ورک فونیکس هست که از طرف بکند یک اطلاعاتی پوش می شه به js فایل به واسطه Hooks. اخیرا ادیتور Ckeditor رو دارم استفاده می کنم که متاسفانه Api یا فانکشنم در اون خوانده نمی شود. انگار که اصلا گوش نمی ده حتی اولین بار که داره بالا می یاد

کد به شرح زیر است:

Hooks.Editor = {
  mounted() {
    var container = document.querySelector("#editor");
    const view = this;
    if (container != null) {
      ClassicEditor
      .create(container, {
        toolbar: {
        items: ckeditorItems,
        shouldNotGroupWhenFull: true
        ....
    } )
    .then( editor => {
        window.editor = editor;

        this.handleEvent("update-editor-html", ({html}) => {
            const content = html;
            const viewFragment = editor.data.processor.toView( content );
            const modelFragment = editor.data.toModel( viewFragment );
            editor.model.insertContent( modelFragment );
        });

        editor.model.document.on('change:data', (eventInfo, batch ) => {
            var data = { html: editor.getData()};
            view.pushEvent("save-editor", data);
        });
        .....

اگر به this.handleEvent("update-editor-html", ({html}) توجه کنید من در این قسمت می یام html شروع لود ادیتور رو با این فانکشن عوض می کنم ولی متاسفانه اصلا این فانکشن من اینجا در نظر گرفته نمی شه. ولی کافیه ببرمش بالاتر زیر مثلا if اونجا کار می کنه
تشکر

من حتی اومدم در بالای کد

Hooks.Editor = {
  mounted() {
    var container = document.querySelector("#editor");
    const view = this;
    let YourEditor;

یک متغییر درست کردم let YourEditor; بعد اومدم در کد زیر ارزش گزاری کردم

				.then( new_editor => {
					window.editor = new_editor;
          YourEditor = new_editor;

باز وقتی در بیرون کد ادیتور می یام

this.handleEvent("update-editor-html", ({html}) => {
        console.log(YourEditor.getData())
      });

می زنم ارور

 Uncaught TypeError: Cannot read property 'getData' of undefine

می ده


به روز رسانی:

من می تونم بیام یک متغییر بالا بسازم و به صورت زیر بخونمش

this.handleEvent("update-editor-html", ({html}) => {
        serverHtml = html;
      });

و در زیر .then بیام

				.then( new_editor => {
					window.editor = new_editor;
          new_editor.setData(serverHtml);

مشکل حل می شه ولی این کد یکبار اوکی می شه و هرسری که مثلا serverHtml تغییر کنه تغییری در ادیتور شکل نمی گیره چون انگار یک بار بایند می شه


حل شد

یک متغییر از نوع var ساختم و ورودی اولیه اون رو null قرار دادم و اولین بار داره بایند می شه ادیتور همون null باقی می مونه بار دوم پر شده چون داخل ادیتور اون رو مساوی کردم با خود ادیتور و در حقیقت یک اینستنس درست کردم و حالا می شه همه جا استفاده کرده

متاسفانه بنده در جاوااسکریپت خوب نیستم و چون به صورت پیشفرض ازش بدم می یاد مورد به این کوچیکی برام خیلی بزرگ می شه

1 Likes