访问 class 中的私有属性

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();

我希望这会将 window 的标题设置为 "title: testtitle"。相反，它将标题设置为 "title: undefined".

Add-on：如果我使用

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

我得到 "Uncaught TypeError: this.getMytitle is not a function"。为什么？

Answer 1

第一个问题 当计算 title: 'title: ' + this.mytitle 时，this 不指向 class 的实例。你应该从 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);        
    },

访问 class 中的私有属性

Accessing private attribute within the class

javascript

extjs

extjs6