كيف أعرض بيانات من صفحة أل صفحة أخرى في electron.js?

Mohamed Lamin Mahmoudi · 10 أغسطس 2022

البيانات التي أريد أن أعرضها هي على شكل مصفوفة أمراض , وعند الضغط على إسم المصفوفة في صفحة التخصصات تفتح الصفحة الخاصة بعرض الامراض الخاصة بهذا التخصص

ملف index.js

let maladie=document.querySelectorAll('ul li');
 maladie.forEach(function(el){
  el.addEventListener('click',function(e){
   let des= PathData.filter(function(ele){
      if(ele.name===el.innerText){
        return ele;
      }
    });
  let dataMaladie=des[0].Diseases;
  
  ipcRenderer.send('openmaladie-page',dataMaladie);
   e.preventDefault();
     });
 });

dataMaldie هو مصفوفة فيها جميع الامراض الخاصة بالتخصص المضغوط عليه وهي تعرض بشكل صحيح

ملف Main.js

// إستقبال الامراض الخاصة بكل تخصص 
ipcMain.on('openmaladie-page',function(e,data){
// إرسالها إلى الامراض
console.log(data);
   win.webContents.send("dataMaladie",data);
   
   //فتح صفحة الامراض 
   creatWindow('maladie.html');
});

ملف maladie.js الخاص بالامراض

const {ipcRenderer} =require('electron');

ipcRenderer.on('dataMaladie',function(e,data){
    
    console.log(data);
    let con=document.querySelector('#Diseases');
    for(let i=0; i<data.length;i++){
        let li=` <li class="col-3 patho ">
        <a href="#">
                <span class="ml-4 ">${data[i]}<span>
        </a>    
     </li>`;
     con.append(li);
    }
   
});

هنا بعد ما أستقبل الامراض الموجودة في المصفوفة واحقنها في الصفحة ثم أعرض الصفحة لايحدث أي تغيير في صفحة html الخاصة بالامراض إضافة إلى عدم طباعة أي شئ في الكونسول !!

maladie.html صفحة الامراض المراد عرضها

 <div class="container-fluid ">
               <button class="btn btn-primary retour">
                <a href="./path.html" >RETOUR</a>
               </button> 
                 <ul id="Diseases" class="row  d-flex ">
                  <li class="col-3 patho ">
                    <a href="#">
                            <span class="ml-4 ">Disease name<span>
                    </a>    
                 </li>
                 </ul>
                </div>
              </div>
        <!-- نهاية العمليات الرئيسية -->
    </div>
   <script src="maladie.js"></script>

Wael Aljamal · 10 أغسطس 2022

يتم تمرير كائن الخطأ هنا حاول طباعته لربما تستفيد

ipcRenderer.on('dataMaladie',function(e,data){
    
    console.log(e);

   
});

Mohamed Lamin Mahmoudi · 10 أغسطس 2022

بتاريخ 3 دقائق مضت قال Wael Aljamal:
يتم تمرير كائن الخطأ هنا حاول طباعته لربما تستفيد
ipcRenderer.on('dataMaladie',function(e,data){
    
    console.log(e);

   
});

لايتم طباعة أي شئ داخل هذه الدالة ولا تنفذ أي تعليمة لا أعرف ما السبب ؟

Wael Aljamal · 10 أغسطس 2022

بتاريخ 3 دقائق مضت قال Mohamed Lamin Mahmoudi:

لايتم طباعة أي شئ داخل هذه الدالة ولا تنفذ أي تعليمة لا أعرف ما السبب ؟

بتاريخ 27 دقائق مضت قال Mohamed Lamin Mahmoudi:

win.webContents.send("dataMaladie",data);

إذاً هذا الحدث لا يتم إرساله بطريقة سليمة،

حاول البحث عن

mainWindow.webContents.send() not received by ipcRenderer.on() function

Mohamed Lamin Mahmoudi · 12 أغسطس 2022

بتاريخ On 10‏/8‏/2022 at 22:11 قال Wael Aljamal:

إذاً هذا الحدث لا يتم إرساله بطريقة سليمة،

حاول البحث عن

mainWindow.webContents.send() not received by ipcRenderer.on() function

وجدت الحل وهو في استعمال الدالة setTimeouet بهذا الشكل

ipcMain.on('openmaladie-page', function(e,data,NamePath){
       
         setTimeout(()=>{
         win.webContents.send('data-Maladie', data,NamePath);
          },500);
       
       creatWindow('maladie.html');
       
        });

لكن المشكل أنني لم أفهم لماذا أستعمل الدالة setTime هنا علما أنني الدالة win.webContents.send في نفس الملف سابقا وتم إرسال البيانات بشكل صحيح

ثانيا المشكل في setTimouet أن البيانات أصبحت تعرض لي على حسب الجهاز إذا كان الجهاز ضعيف يكون بطئ في عرض البيانات

جربت إستعمال promise بهذا الشكل لم يتم عرض البيانات !

ipcMain.on('openmaladie-page', async function(e,data,NamePath){
       
        
       await  win.webContents.send('data-Maladie', data,NamePath);
       
       
       creatWindow('maladie.html');
       
        });

Wael Aljamal · 12 أغسطس 2022

بتاريخ 1 دقيقة مضت قال Mohamed Lamin Mahmoudi:
وجدت الحل وهو في استعمال الدالة setTimeouet بهذا الشكل
 

هذا يعني أنك تحتاج لتأخير لكي تعمل الفكرة،

أي أن الصفحة لم تكن جاهزة لاستقبال البيانات. حاول انتظار الحدث did-finish-load ثم مرر البيانات لها

mainWindow.webContents.on('did-finish-load', ()=>{
  mainWindow.webContents.send('display', __dirname+'\\'+file)
})

Mohamed Lamin Mahmoudi · 12 أغسطس 2022

بتاريخ 6 دقائق مضت قال Wael Aljamal:
هذا يعني أنك تحتاج لتأخير لكي تعمل الفكرة،

أي أن الصفحة لم تكن جاهزة لاستقبال البيانات. حاول انتظار الحدث did-finish-load ثم مرر البيانات لها
mainWindow.webContents.on('did-finish-load', ()=>{
  mainWindow.webContents.send('display', __dirname+'\\'+file)
})

لا تعمل بهذا الشكل !! جربتها سابقا

Wael Aljamal · 12 أغسطس 2022

بتاريخ 2 دقائق مضت قال Mohamed Lamin Mahmoudi:

لا تعمل بهذا الشكل !! جربتها سابقا

السطرين 60-61 هل ترسل البيانات لصفحة لم يتم إنشائها بعد ؟ اليس create window يجب أن تتم قبل

كيف أعرض بيانات من صفحة أل صفحة أخرى في electron.js?

السؤال

Mohamed Lamin Mahmoudi

7 أجوبة على هذا السؤال

Recommended Posts

Wael Aljamal

Mohamed Lamin Mahmoudi

Wael Aljamal

Mohamed Lamin Mahmoudi

Wael Aljamal

Mohamed Lamin Mahmoudi

Wael Aljamal

انضم إلى النقاش

إعلانات

تابعنا على

الرئيسية

تابعنا

دروس ومقالات

أسئلة وأجوبة

كتب

دورات

بطاقات هدية