3

我需要在 sencha 中以 mvc 模式呈现模板，所以在 InitComponent 上我已经声明了一些变量，但我无法在 init 函数之外访问这些变量。我做了以下尝试

Ext.define('casta.view.Intro', {
    extend: 'Ext.tab.Panel',
    //alias: 'widget.currentDate', //this makes it xtype 'currentDate'
    //store: 'CurrentDateStore',


    initComponent: function(){
        this.planetEarth = { name: "Earth", mass: 1.00 };

        this.tpl = new Ext.Template(['<tpl for".">', '<p> {name} </p>', '</tpl>'].join(''));
        this.tpl.compile();
        this.callParent(arguments);

    },
    html:this.tpl.apply(this.planetEarth)
});

错误

this.tpl is undefined
[Break On This Error]   

html:this.tpl.apply(planetEarth)
4

1 回答 1

1

我很确定这不是 JavaScript 作用域的工作方式......

在您的示例中，有两种方法可以做您想做的事情：

//this is the bad way imo, since its not really properly scoped.
// you are declaring the planeEarth and tpl globally
// ( or wherever the scope of your define is. )
var plantetEarth = { name: "Earth", mass: 1.00 }
var tpl = new Ext.Template(['<tpl for".">', '<p> {name} </p>', '</tpl>'].join(''));
tpl.compile();
Ext.define('casta.view.Intro', {
    extend: 'Ext.tab.Panel',
    //alias: 'widget.currentDate', //this makes it xtype 'currentDate'
    //store: 'CurrentDateStore',


    initComponent: function(){

        this.callParent(arguments);

    },
    html:tpl.apply(planetEarth)
});

或者 

//I would do some variation of this personally.
//It's nice and neat, everything is scoped properly, etc etc
Ext.define('casta.view.Intro', {
    extend: 'Ext.tab.Panel',
    //alias: 'widget.currentDate', //this makes it xtype 'currentDate'
    //store: 'CurrentDateStore',


    initComponent: function(){

        this.tpl = new Ext.Template(['<tpl for".">', '<p> {name} </p>', '</tpl>'].join(''));
        this.tpl.compile();
        this.tpl.apply(this.planetEarth);
        this.html = this.tpl.apply(this.planetEarth)
        this.callParent(arguments);

    },

});
于 2012-05-25T08:28:47.260 回答