json - 将数据加载到 JSON-Store

Question

我在开发 Sencha 方面几乎是个新手，所以我真的希望你能帮助我。

您可以在下面看到我的登录功能“onSignInCommand”，它实际上正在运行。通过向服务器发送登录请求，我得到了以下 JSONP 文件。我喜欢将 JSON 文件提供的用户信息(姓名、年龄等)加载到 JSON 存储中。我该如何处理？

{"msg": "OK",
 "user": {
          "token": "xyz",
          "firstName": "Bertha",
          "lastName": "Muster",
          "age": "24",
         }
}

==========

onSigninCommand: function(view, username, password) {
    var data1 = username;
    var data2 = password;
    var me = this;
    loginView = me.getLoginView();
    if (username.length === 0 || password.length === 0) {
        loginView.showSignInFailedMessage('keine eingabe');
        return;
    }
    console.log('Username: ' + username + '\n' + 'Password: ' + password);
    Ext.util.JSONP.request({
        url: 'http://127.0.0.1:4712/talentcommunity/getuserinfo',
        headers: {
            'content-type': 'application/x-www-form-urlencoded ; charset=utf-8'
        },
        method: 'post',
        params: {
            user: data1,
            pw: data2
        },
        callbackKey: 'callback',
        success: function(response) {
            console.log(response);
            var loginResponse = response;
            if (loginResponse.msg == "OK") {
                me.signInSuccess();
            } else {
                loginView.showSignInFailedMessage('token null.');
            }
        },
        failure: function(response) {
            loginView.showSignInFailedMessage('token null.');
        }
    });

---

如您所说，我在“onSignInCommand”中编辑了成功函数。但它不执行 XXX.store.MyJsonPStore.loadData(jsonResponse)。

Store 本身在一个单独的文件中定义，见下文。

你能再帮我一次吗？

onSigninCommand: function(view, username, password) {
var data1 = username;
var data2 = password;
var me = this;
loginView = me.getLoginView();
if (username.length === 0 || password.length === 0) {
    loginView.showSignInFailedMessage('keine eingabe');
    return;
}
console.log('Username: ' + username + '\n' + 'Password: ' + password);
Ext.util.JSONP.request({
    url: 'http://127.0.0.1:4712/talentcommunity/getuserinfo',
    headers: {
        'content-type': 'application/x-www-form-urlencoded ; charset=utf-8'
    },
    method: 'post',
    params: {
        user: data1,
        pw: data2
    },
    callbackKey: 'callback',

    success: function (response) {

      console.log(response);

      var loginResponse = response;

      if (loginResponse.msg == "OK") {

           var jsonResponse = Ext.JSON.decode(response.responseText);
           XXXne.store.MyJsonPStore.loadData(jsonResponse);
           me.signInSuccess();
      }

      else {
           loginView.showSignInFailedMessage('token null.');
      }
    },

    failure: function(response) {
        loginView.showSignInFailedMessage('token null.');
    }
});

=============

Ext.define('xxx.store.MyJsonPStore', {
  extend: 'Ext.data.Store',
  alias: 'store.myStore',

  requires: [
  'xxx.model.user'
  ],

  config: {
     model: 'xxx.model.user',
     storeId: 'myStore',
     proxy: {
        type: 'jsonp',
        url: 'http://127.0.0.1/talentcommunity/getuserinfo',
        autoAppendParams: false,
        reader: {
          type: 'json'
        }
     }
  }
});

Answer 1

参见 sencha api:create model/store

<强>1。使用相同的字段名称生成您的模型/商店:

// Set up a model to use in our Store
Ext.define('User', {
    extend: 'Ext.data.Model',
    fields: [
        {name: 'username', type: 'string'},
        {name: 'password',  type: 'string'},
        {name: 'age',       type: 'int'},
        {name: 'token',  type: 'string'}
    ]
});

var myStore = Ext.create('Ext.data.Store', {
    model: 'User',

});

<强>2。在商店加载数据:

关于“Ext.util.JSONP.request”:

...
success: function(response) {

var jsonResponse = Ext.JSON.decode(response.responseText);
myStore.loadData(jsonResponse);

}

但我更喜欢在商店中使用代理配置:

var myStore = Ext.create('Ext.data.Store', {
    model: 'User',
    proxy: {
            type: 'ajax',
            url : 'http://127.0.0.1:4712/talentcommunity/getuserinfo',
            reader: {
                type: 'json',
                root: 'users'
            }
        }
}