Połączenia zwrotne w oknach JavaScript JavaScript z jQuery

Question

Jak mogę przetłumaczyć następujący kod jquery na Dart? Mam trudności z uruchomieniem wywołania zwrotnego alertu za pomocą 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> 

Każda pomoc jest doceniana.

Answer 1

dzięki za twoje pytanie! Nie byłem pewien siebie, ale okazuje się, że to możliwe. :)

Po pierwsze, dodać js do pubspec.yaml:

name: jquerydart 
description: A sample application 

dependencies: 
    js: any 

Następnie uruchom pub zainstalować, albo za pośrednictwem linii poleceń lub poprzez Dart Editor.

Następnie w pliku Dart:

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())); 
    }); 
} 

Należy pamiętać, że do oddzwonienia z JS w Dart, trzeba utworzyć obiekt oddzwaniania.

Należy również pamiętać, że nie można użyć $ dla zmiennej jQuery, ponieważ dart2js używa również $. W międzyczasie musisz użyć kodu jQuery w swoim kodzie Dart.

Powiedziawszy to wszystko, fajnie jest, że możemy używać jQuery poprzez interakcję JS-Dart, ale Dart naprawdę powinien to zrobić dla nas. Więc otworzyłam błąd http://code.google.com/p/dart/issues/detail?id=6526

Answer 2

najpierw dodać do swojego uzależnienia jspubspec.yaml:

dependencies: 
    js: any 

Korzystając JS-współdziałanie można napisać prawie taki sam jak w kod javascript.

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"); 
     })); 
    })); 
    }); 
} 

Główne różnice to:

• Musisz użyć js.Callback.once lub js.Callback.many ustawić swoje funkcje zwrotne. Użyj numeru js.Callback.once, jeśli Twój oddzwaniany jest tylko jeden raz.
• Twój kod musi być opakowany w js.scoped. Zasadniczo, tutaj jest managing proxy lifetimes, aby zapobiec wyciekom pamięci.

Powiedział, że można uprościć powyższy kod:

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"); 
    })); 
    }); 
} 

Zmiany są następujące:

• js.context.$(new js.Callback.once(($) { nie jest potrzebne, ponieważ main jest równoznaczne z jQuery $(function).
• js.context.alert było zastąpić przez window.alert: to bardziej efektywne korzystać bezpośrednio DART funkcje zamiast komunikować się z JS.