ExtJs6 form回显combo下拉框的值方法

一般grid加载出来值之后我们对某一行编辑时，打开form会出现远程查询下拉框值不会回显，也就是没有值的情况，我们可以按照以下方法让值回显。
比如说后端返回实体类中有cityId和cityName两个字段。
大体思路就是，弹出form时手动加载下拉框store同时监听load事件将id和name插到store里。

combo下拉框组件部分：
Ext.define('App.textfield.CityField', {
    extend: 'Ext.form.ComboBox',
    alias: 'widget.cityfield',
    emptyText : '输入城市自动检索',
    displayField: 'name',
    valueField: 'id',
    minChars: 0,
    queryMode: 'remote',
    queryParam : 'param',
    bind : {
        store : '{cityStore}'
    },
    listConfig: {
        itemTpl: [
            '
{name} ({ename})
'
        ]
    }
});
grid表格部分：
{
    bind : {
        text : '{cityId}'
    },
    dataIndex : 'cityId',
    renderer : 'convertCity'
}
form部分(因为把下拉框策略写成组件，所以form部分可以极大简化代码而且方便重用，只需要引一个xtype即可)：
{
    xtype : 'cityfield',
    bind : {
        fieldLabel : '{cityId}'
    },
    name : 'cityId'
}
store部分(为了form回显下拉框值需要加load监听)：
cityStore : {
    model : 'App.model.City',
    autoLoad : false,
    pageSize : 15,
    session : true,
    proxy : {
        type : 'ajax',
        url : 'city/load.do',
        reader : {
            rootProperty : 'data'
        }
    },
    listeners : {
        load : 'onCityComboLoad'
    }
},
controller部分：
比如说grid对某一行双击时弹出该行的form，所以grid监听一个rowdbclick事件，以此为背景。
onRowdblclick : function(table, record, tr, rowIndex, e, eOpts){
    var me = this,
        store = me.getStore('cityStore'),
        form = me.lookupReference('formpanel').getForm();
    if(record){
        form.loadRecord(record || {});
        me.getViewModel().set('_rcd',record);
    }
    store.load();
},
onCityComboLoad : function(st){
    var rcd = this.getViewModel().getData()['_rcd'],
        rcddata = rcd.getData(),
        cityId = rcddata['cityId '],
        cityName = rcddata['cityName'];
    st.insert(0,{
        'name' : cityName ,
        'id' : cityId 
    });
}