Question

我是Sencha 2的菜鸟，我试图找到一种方法来在点击按钮时渲染新视图。具体来说，我有一个名为Home

的视图

主

Ext.define("Blog.view.Home", {
  extend:'Ext.Panel',
  xtype:'homepanel',


  config:{
    iconCls:"home",
    title:"Home",
    items:[
      {
        defaults:{
          iconMask:true
        },
        xtype:'toolbar',
        title:'Recent Blogs',
        docked:'top',
        items:[
          {
            id:'newBlog',
            xtype:'button',
            iconCls:'add',
            handler:function () {
              //What do I do here?
            }
          }
        ]
      },

      {
        html:"Recent Blogs"
      }
    ]
  }
});

我想要点击该按钮来渲染新视图。我只是不确定我会怎么做这件事。有人可以给我一些指针吗？这是最好的方法吗？我应该将它移动到我的控制器吗？如果是，我应该听哪个事件？

Answer 1

我这样做的方式（我也在学习）是定义按钮的属性“动作”，例如：

{
  xtype: 'button'
  action: 'doSomething',
}

并在我的控制器的控制配置中处理事件：

control: {
  'button[action=doSomething]' : {
     tap: function() {
       getMainView().push(...);
     }
 }

在处理程序中，如果您使用NavigationView或直接向ViewPort添加新视图，则可以推送新视图。

希望它有所帮助。

Answer 2

在Sencha Touch 2（遵循MVC模式）中执行此操作的最佳做法是定义对按钮的引用，并在控制器中为其添加控制功能。例如：

refs:{
button_which_renders_a_new_view: '#newBlog' //create a reference to your button

control: {
button_which_renders_a_new_view: 'create_a_new_view'
}

create_a_new_view: {
// do whatever you want here
}

有关详细信息，请让我们深入了解一下：http://docs.sencha.com/touch/2-0/#!/api/Ext.app.Controller

单击按钮时渲染新视图

2 个答案: