ExtJs6 formpanel tagfield组件设置默认值(formpanel展现时tagfield组件列部分数据被选中)

当我们的formpanel的某一列是tagfield的时候我们想要展现formpanel时,下拉框里的部分选项就被选中,我们该怎么做呢?
看下面代码:

tagfield组建部分,为了简洁化formpanel的代码和提高组建重用性,专门把tagfield拿出来写:
Ext.define('App.textfield.CaseTypesField', {
    extend: 'Ext.form.field.Tag',
    alias: 'widget.casetypesfield',
    queryMode : 'local',
    filterPickList: true,
    store : [  
        [ 121, '行程说明' ],
        [ 123, '总人数' ],
        [ 124, '计费人数' ],
        [ 125, '酒店说明' ],
        [ 105, '酒店' ],
        [ 103, '车' ],
        [ 104, '导游' ],
        [ 109, '景点' ],
        [ 107, '餐' ],
        [ 113, '水' ],
        [ 101, '航班' ],
        [ 108, '翻译' ],
        [ 117, '营地' ],
        [ 118, '公务' ],
        [ 116, '展览' ],
        [ 119, '租车' ],
        [ 120, '当地团' ],
        [ 100, '领队' ],
        [ 106, '保险' ],
        [ 102, '邮轮' ],
        [ 126, '单日总价' ],
        [ 127, '单日均价' ]
    ]
});
formpanel部分:
    items : [
        {
            xtype : 'casetypesfield',
            bind : {
                fieldLabel : '{caseTypes}'
            },
            name : 'caseType'
        }
    ]
controller部分:
beforeRender : function(){
    var form = this.getView().getForm(),
        items = form.findField('caseType').getStore().getData().items,
        rcds = items.splice(0,10);//因为默认选中store中前10列数据,所以截到10
    form.findField('caseType').setValue(rcds);
},

效果图,formpanel点开展示列即部分数据被选中:
ExtJs6 formpanel tagfield组件设置默认值(formpanel展现时tagfield组件列部分数据被选中)_第1张图片

你可能感兴趣的:(ExtJs6)