jQuery के साथ डार्ट जावास्क्रिप्ट इंटरऑप कॉलबैक

Question

मैं निम्नलिखित jquery कोड को डार्ट में कैसे अनुवाद कर सकता हूं? मुझे js.interop का उपयोग करके काम करने के लिए अलर्ट कॉलबैक प्राप्त करने में कठिनाई हो रही है।

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
<script> 
    $(function() { 
    $('p').hide('slow', function() { 
     alert("The paragraph is now hidden"); 
    }); 
    }); 
</script> 

किसी भी मदद की सराहना की है।

Answer 1

आपके प्रश्न के लिए धन्यवाद! मैं खुद को यकीन नहीं था, लेकिन यह पता चला है कि यह संभव है। :)

पहले, जोड़ने js अपने pubspec.yaml रहे हैं:

name: jquerydart 
description: A sample application 

dependencies: 
    js: any 

फिर, पब स्थापित करते हैं, या तो कमांड लाइन के माध्यम से या डार्ट संपादक के माध्यम से चलाते हैं।

फिर, अपने डार्ट फ़ाइल में:

import 'dart:html'; 
import 'package:js/js.dart' as js; 

hideIsDone() { 
    window.alert('all done!'); 
} 

void main() { 
    js.scoped(() { 
    js.context.jQuery('p').hide(1000, new js.Callback.once(() => hideIsDone())); 
    }); 
} 

ध्यान दें कि जे एस से डार्ट में कालबैक में, आप एक कॉलबैक वस्तु बनाने के लिए की जरूरत है।

यह भी ध्यान दें कि आप jQuery चर के लिए $ का उपयोग नहीं कर सकते हैं, क्योंकि dart2js $ का भी उपयोग करता है। तो इस बीच आपको अपने डार्ट कोड में jQuery का उपयोग करने की आवश्यकता है।

यह सब कहकर, यह अच्छा है कि हम जेएस-डार्ट इंटरऑप के माध्यम से jQuery का उपयोग कर सकते हैं, लेकिन डार्ट को वास्तव में हमारे लिए यह करना चाहिए। इसलिए मैं बग http://code.google.com/p/dart/issues/detail?id=6526

Answer 2

सबसे पहले अपने pubspec.yaml करने के लिए js निर्भरता जोड़ने खोला:

dependencies: 
    js: any 

js-इंटरॉप का उपयोग कर आप जावास्क्रिप्ट में के रूप में लगभग एक ही कोड लिखने सकते हैं।

import 'dart:html'; 
import 'package:js/js.dart' as js; 

void main() { 
    js.scoped(() { 
    js.context.$(new js.Callback.once(($) { 
     $('p').hide('slow', new js.Callback.once(() { 
     js.context.alert("The paragraph is now hidden"); 
     })); 
    })); 
    }); 
} 

मुख्य अंतर हैं:

• आप js.Callback.once या js.Callback.many उपयोग करने के लिए अपने कॉलबैक कार्यों सेट करना होगा। यदि आपकी कॉलबैक केवल एक बार कॉल है तो js.Callback.once का उपयोग करें।
• आपका कोड js.scoped के साथ लपेटा जाना चाहिए। मूल रूप से, managing proxy lifetimes स्मृति रिसाव को रोकने के लिए यहां है।

  import 'dart:html'; 
  import 'package:js/js.dart' as js; 
  
  void main() { 
      js.scoped(() { 
      js.context.$('p').hide('slow', new js.Callback.once(() { 
       window.alert("The paragraph is now hidden"); 
      })); 
      }); 
  } 
  

  परिवर्तन कर रहे हैं:

जिसके अनुसार, यदि आप उपरोक्त कोड को आसान बनाने में कर सकते हैं

• js.context.$(new js.Callback.once(($) { की जरूरत नहीं है क्योंकि main jQuery $(function) के बराबर है।
• js.context.alert किया गया है window.alert से बदल देते हैं: इसे और अधिक सीधे डार्ट कार्यों का उपयोग करने के बजाय जे एस के साथ संवाद कुशल है।