完成所有渲染并已渲染inputEl后，哪种方法应该更有效

问题描述

在完成所有渲染并已渲染inputEl之后，哪个方法应该更完善。

我在使用tabpanel的面板和窗格中有表单，而表单有displayfield。

就我而言，我的displayfield值未得到渲染。该值在dom中不可用。所以我想手动添加这些值。

Ext.fly(displayfield.id).set({ 'value': displayfield.value });

但是问题是

-afterender方法在dom中的渲染完成之前变得越来越复杂。并建议使用哪种方法。

解决方法

让系统为您完成工作。

在表单面板的viewModel中设置值，并将显示字段的value属性绑定到viewModel中的data属性。

Sencha Fiddle

    Ext.application({
    name: 'Fiddle',launch: function () {
        Ext.create('Ext.form.Panel',{
            renderTo: Ext.getBody(),viewModel: {
                data: {
                    field1: 'default view model'
                }
            },controller: {
                init: function(formPanel) {
                    formPanel.getViewModel().set('field1','New Display Value');  
                },},items: [{
                title: 'Title',bodyPadding: '10 15 0 10',layout: {
                    type: 'vbox'
                },items: [{
                  xtype: 'displayfield',name: 'field1',bind: {
                      value: '{field1}'
                  },value: 'default value',fieldLabel: 'Field One'
                }]
            }]
        });
    }
});