理解Sencha Touch语法

Understand Sencha Touch syntax

本文关键字：语法 Touch Sencha 理解      更新时间：2023-09-26

我浏览了dev.sencha.com，虽然我理解Javascript/jQuery，但我不理解sencha Touch或ExtJS中遵循的语法。

你能举一个语法是什么或如何工作的例子来概括一下吗。。此外，当试图将Sencha touch集成到HTML/CSS网络应用程序中时，应该如何思考？还有什么与jQuery相似的地方吗？

Sencha Touch是Javascript。它是用JS编写的，库中几乎没有什么魔力。如果你理解JS，你应该能够理解Sencha Touch。

Sencha Touch和JQuery是处理同一问题的截然不同的方法。SenchaTouch比jQuery更多地使用面向对象编程概念。还有一些事情非常相似。在jQuery中工作了这么长时间后，在处理其他Javascript库时需要有一个开放的心态，因为jQuery没有遵循不同的概念。

此外，图书馆还瞄准了不同的"利基市场"。我想说，SenchaTouch更像是一个MVC库，包含UI小部件（如jQueryUI），具有多个数据抽象（ORM-lite、同步），并且恰好具有DOM操作。jQuery主要是DOM操作。

jQuery和Sench Touch相同之处：

jQuery

$('#mydiv').addClass('highlighted').css({'background-color': red'});

Sencha Touch：

Ext.select('#mydiv').addCls('highlighted').applyStyles({'background-color': red'});

jQuery

$.get('someurl', 'get', function(){ console.log("Success")})

Sencha Touch

Ext.Ajax.request({'url': 'someurl', 
  method: 'get', 
  success: function(){ console.log('success')})

因此，您可以看到在这两个库中都有执行类似任务的方法。

但是，在jQuery中不能做的事情。就像创建一个完整的浏览器窗口，其中有一个旋转木马。Sencha Touch：

var panel = Ext.Panel({
   dockedItems: [ {xtype: 'toolbar', title: 'Sample Toolbar', dock: 'top' } ]
   items: [ {xtype: 'carousel', items: [
             {html: 'card 1'},
             {html: 'card 2'}]
   ],
   fullscreen: true
});
panel.show();

与其在网上看他们的演示（我同意这可能会让人很困惑），我建议在他们的vimeo频道上观看他们的介绍视频，并在下载的源代码中查看他们的示例。

相关文章：