将简单视图模型与单个记录绑定

时间:2015-10-06 02:28:40

标签: javascript extjs mvvm extjs6

我创建了this fiddle来展示我想要做的事情。

基本上,我配置了Store只加载一条记录(实际上它将是当前登录的用户)。但是,我似乎无法正确绑定任何商店。如何才能正确输出{u.name}

以下是代码:

Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: ['id', 'name']
});

Ext.application({
    name : 'Fiddle',

    launch : function() {

        new Ext.Component({
            renderTo: Ext.getBody(),

            viewModel: {
                stores: {
                    u: {
                        proxy: {
                          type: 'ajax',
                          url: 'user.json'
                        },

                        model: 'User',

                        autoLoad: true
                    }
                }
            },

            bind: 'Test name: {u.name}'
        });

    }
});

2 个答案:

答案 0 :(得分:4)

Try bind: 'Test name: {u.data.items.0.name}'

UPD: As an explanation to this - u is an object with its properties, so trying to bind to u.name will actually bind to the name property of the store. Wile the store has no name property it will always be null. Store's received data is placed in data property. Items property contains a raw array of received data and so on.

答案 1 :(得分:2)

在您的小提琴中,您正在使用商店,而您似乎只需要一条记录。

使用links代替stores应该更好,例如:

links: {
    u: {
        type: 'User',
        id: 1
    }
}

基于您的代码的工作示例:https://fiddle.sencha.com/#fiddle/uuh

相关问题