Question

为什么以下代码不起作用（ExtJS V6）？

Ext.define('Test', {
extend: 'Ext.window.Window',
xtype: 'basic-window',

config: {
    mytitle: ''
},

constructor: function (config) {
    Ext.apply(this, config);
    this.callParent(config);
},

requires: [
           'Ext.form.Panel'
       ],

height: 300,
width: 400,
scope: this, 
title: 'title: ' + this.mytitle,
autoScroll: true,
autoShow: true,
bodyPadding: 10,
html: "Lorem ipsum",
constrain: true,
});

var t = Ext.create('Test', {mytitle: 'testtitle'});
t.show();

我希望这会将窗口的标题设置为＆＃34; title：testtitle＆＃34;。相反，它将标题设置为＆＃34; title：undefined＆＃34;。

附加组件：如果我使用

...
title: 'title' + this.getMytitle(),
...

我得到＆＃34;未捕获的TypeError：this.getMytitle不是函数＆＃34;。为什么？

Answer 1

第一个问题 评估title: 'title: ' + this.mytitle时，this不会指向您班级的实例。你应该从constructor

那里做到这一点

同时对callParent的调用需要一系列参数，更容易始终调用this.callParent(arguments)

<强>最后您只能在调用构造函数后调用this.getMytitle()。

请参阅https://fiddle.sencha.com/#fiddle/uh9

constructor: function(config) { this.callParent(arguments); this.setTitle( 'title: ' + this.getMytitle() ) },

关于配置响应正在设置的配置的正确方法

通过实施updateMytitle，只要有人拨打setMytitle('title')
，它也会有效
https://fiddle.sencha.com/#fiddle/uha

Ext.define('Test', { extend: 'Ext.window.Window', xtype: 'basic-window', requires: ['Ext.form.Panel'], config: { mytitle: '' }, updateMytitle: function(mytitle) { this.setTitle('title: ' + mytitle); },

访问类中的私有属性

1 个答案: