Sencha Touch开发心得分享

【1】组件获取方式：

第一种：

refs:
{

    wbList: 'waybillList'

},

在controller中定义wbList，其中waybillList为列表的xtype，获取组件方式如下：

var me = this,

    wbList = me.getWbList();

第二种：

var me = this,

    packList = me.getPackList();

var packSet = Ext.create('Ext.form.FieldSet',
{

    title: title,

    itemId: 'add',

    items:
[

        {

            xtype: 'list',

        }

    ]

});

packList.add([packSet]);

定义form组件，获取组件方式如下：

var pack_item = packList.getComponent('add');

第三种：

list为某组件下的列表的xtype，获取组件方式如下：（是通过xtype获取的）

var goods_list = pack_item.down('list');

再如获取form下某组件（是通过itemId获取的）

var serviceItem = myForm.down('#serviceItem');

第四种：

通过全局检索（不建议该用法），其中insurance为组件的itemId属性

var insuranceCon = Ext.ComponentQuery.query("#insurance")[0];

【2】store获取方式：

var waybillStore = Ext.getStore('Waybill');

waybillStore.load({

    callback: function(records,
operation, success) {

            var addWaybill = wbList.down('#addWaybill');

            if(!Ext.isEmpty(records)){

             
  addWaybill.setHidden(true);

            }else{

             
  addWaybill.setHidden(false);

            }

        }

});

【3】页面回退：

history.back();

【4】页面跳转：

me.redirectTo('view/account_Login');（该方法为封装方法）

redirectTo: function (place,
data) {

        var me = this;

        me.hideMenus();

        Ext.leo.CONTEXT.viewData =
data;

        return
this.callSuper([place]);

},

【5】列表页长按短按问题：

1.列表单击事件：

onWaybillListTap: function (list,
index, target, record, e, eOpts) {

    if (!list.isTapHold)
{ //有长按标识，则不执行下面的代码

   
console.log('itemtap');//这里的代码才是点击事件

   
}else{

       delete list.isTapHold; //否则清除长按标识

   }

},

2.列表长按事件:

onHoldWaybillListTap: function (list,
index, target, record, e, eOpts) {

     list. isTapHold = true;
//增加标识：是否长按操作

}

【6】按钮的定义及弹层：

var items =
[{
text: '添加', 
  

    itemId:"addWaybillList",

    xtype:'button',

    ui : 'action',

    scope:this,

    cls:'cls
cls2',

    handler: function(){

 
this.actions.hide(); 
      

this.actions.destroy(); 
      

this.actions = null; 
      

me.redirectTo('view/member_WbEdit/opt-add_wh-'+record.data.wh_id);

    
}
}];
弹层新增一个viewport：
if (this.actions)
{
    this.actions.destroy();
    
this.actions = null;
}
..........................................【弹层内容代码】items定义后加元素可通过items.push(edit)实现
if(!this.actions){ 
  

    this.actions = Ext.create('Ext.ActionSheet',{ 
  

items:items
    });
}
Ext.Viewport.add(this.actions);
this.actions.show();
【7】页面加载或提交等待提示：

例：列表页进入详情页，或详情页提交表单
如列表页进入详情页，在获取详情页数据时加入以下代码：
Ext.Viewport.setMasked({
    xtype: 'loadmask',
    message: '努力加载中...'
});
在aj请求成功并渲染完列面数据后关闭，加入以下代码：
Ext.Viewport.setMasked(false);
注意：1.在哪里添加加载中的提示就对哪个组件进行加载（wbForm）或者采用新viewport（Ext.Viewport）
      2.该操作的aj请求方式应为true,即异步请求

【8】接口对空值处理问题及节省网络开销双保险：
var store = Ext.getStore('Waybill');
var extraParams = store.getParams();
store.currentPage = 1;
extraParams.condition = condition;
extraParams = Ext.leo.filterEmpty(extraParams);
store.setParams(extraParams);
store.load();