Sencha Touch 让一个简单的按钮工作

Posted 2023-02-26

【中文标题】Sencha Touch 让一个简单的按钮工作

【英文标题】：Sencha Touch Making a simple button work

【发布时间】：2015-03-27 14:43:25

【问题描述】：

我很难调试和理解为什么我的 sencha 项目中最基本的东西会出错。我使用 webstorm，但它似乎对拼写错误的代码没有多大帮助。我得到的大多数错误都不清楚，比如 undefined 不是一个函数。任何人都可以通过向我展示我在以下代码中做错了什么来帮助我。我只想要一个记录控制台日志的按钮。

查看：

    Ext.define('imp.view.Test', 
        extend: 'Ext.form.Panel',
        alias: "widget.test",
        xtype: 'test',
        controllers: 'imp.controller.Test',
        requires: [ 'imp.controller.Test'],

        config: 
            title:'Test',
            scrollable: null,
            items: [

                
                    xtype: 'button',
                    itemId: 'postButton',
                    ui: 'action',
                    padding: '10px',
                    text: 'Post'
                ]


        

);

控制器：

Ext.define('imp.controller.Test', 
    extend: 'Ext.app.Controller',
    config: 
        refs: 
            testView: 'test'
        ,
        control: 
            'test #postButton': 
                tap: 'onPostCommand'
            
        
    ,

        onPostCommand: function ()
            console.log('klik');


        

    
);

什么是调试和更好地学习 Sencha Touch 的好方法，有人能给我一些建议吗？什么书、网站等好？

更新： 这是控制台日志输出，当我按下按钮时，什么也没有发生.....

development.js:21 Synchronous XMLHttpRequest on the main thread is deprecated because of its detrimental effects to the end user's experience. For more help, check http://xhr.spec.whatwg.org/.
development.js:22 XHR finished loading: GET "http://imp.localhost/imp/bootstrap.json".
development.js:9 GET http://imp.localhost/imp/cordova.js 
sencha-touch.js:13036 The key "minimum-ui" is not recognized and ignored.
Abstract.js?_dc=1427878432368:27 The 'overflowchanged' event is deprecated and may be removed. Please do not use it.
Console.js?_dc=1427878432463:35 [WARN][Anonymous] [Ext.Loader] Synchronously loading 'imp.store.Offline.Opdrachten'; consider adding 'imp.store.Offline.Opdrachten' explicitly as a require of the corresponding class
sencha-touch.js:8381 XHR finished loading: GET "http://imp.localhost/imp/app/store/Offline/Opdrachten.js?_dc=1427878433743".
sencha-touch.js:8381 XHR finished loading: GET "http://imp.localhost/touch/src/data/ArrayStore.js?_dc=1427878433755".
sencha-touch.js:8381 XHR finished loading: GET "http://imp.localhost/touch/src/data/reader/Array.js?_dc=1427878433767".
Console.js?_dc=1427878432463:35 [WARN][Anonymous] [Ext.Loader] Synchronously loading 'imp.store.Offline.Antwoorden'; consider adding 'imp.store.Offline.Antwoorden' explicitly as a require of the corresponding class
sencha-touch.js:8381 XHR finished loading: GET "http://imp.localhost/imp/app/store/Offline/Antwoorden.js?_dc=1427878433786".
Connection.js?_dc=1427878433330:375 GET https://simplemanager.transfer-solutions.com/ords/simplemanager/test1/planningen 401 (Unauthorized)
Connection.js?_dc=1427878433330:375 XHR finished loading: GET "https://simplemanager.transfer-solutions.com/ords/simplemanager/test1/planningen".

【问题讨论】：

您在浏览器控制台窗口中遇到什么错误？这通常是调试 JS 问题的最佳方式，因为大多数问题只会在特定条件下或响应特定事件时发生。

完全没有错误。它只是不工作....

我熟悉 javascript 调试，但是 Sencha 似乎是一种不同的类型，有它自己的问题......

是的，您需要处理 sencha 生态系统，您需要熟悉它的工作原理。如果无法复制问题，很难调试您的代码，您可以在 fiddle.sencha.com 上创建一个小提琴吗？

最好的调试方式是使用开发者工具和console.log。 Console.log 对我构建 sencha touch 应用程序有很大帮助

【参考方案1】：

找出代码是否有问题的最佳方法是使用 Firefox 中的 Firebug 或 Chrome 中的开发者工具。

提到您的问题，我刚刚从代码中删除了util.Utility，它工作正常。因此，您要确定app/util 文件夹中是否有任何Utility.js。另外，Utility.js 应该遵循 Sencha 类结构：

Ext.define('.util.Utility',  /*upper case "U" in important*/
      config : 
      
);

最后，您应该会在控制台输出中看到 klik 或错误。

【讨论】：

我就是这样做的，但它没有任何帮助。我不明白为什么它适用于你而不适用于我。你能给我看看你的煎茶小提琴吗？我确实在那个文件夹中有一个 Utility.js...

@Robert 我的代码和你的一样。我只是删除了Utility.js 声明。我认为您应该查看控制台输出以了解可能的错误，以及是否可以在此处复制输出以进行更多检查。我也更新答案看看。

我删除了该实用程序并在 de post 中添加了控制台输出。

@Robert 似乎错误在视图和控制器之外。首先，为了确保您正确设置 Sencha，请尝试运行一些可以在网上找到的代码示例。其次，如果样品运行没有任何问题。将其他项目文件添加到问题中。祝你好运。