网格面板不会在 ext js 6.0.0 中呈现存储答案

【问题标题】：Grid panel doesnot render store in ext js 6.0.0网格面板不会在 ext js 6.0.0 中呈现存储
【发布时间】：2023-03-10 04:03:01
【问题描述】：

我正在学习“Mastering Ext Js”一书，我在 Grid Panel 上遇到了问题，没有从存储中加载数据，我调试 Json 格式服务器很好，我不知道是什么问题，因为控制台没有错误。

这是我的模型类

Ext.define("pg.model.security.User", {
extend: 'Ext.data.Model',
idProperty: 'userName',
fields: [
    {
        name: 'userName'
    }, {
        name: 'roleId'
    }, {
        name: 'fullName'
    }, {
        name: 'emailId'
    }, {
        name: 'mobileNumber'
    }, {
        name: 'landLineNumber'
    }, {
        name: 'picture'
    }
]
});

这里是商店类

Ext.define('pg.store.security.Users', {
extend: 'Ext.data.Store',
requires: [
    'pg.model.security.User' // #1
],
storeId:'userStore',    
model: 'pg.model.security.User', // #2
proxy: {
    type: 'ajax',
    url: 'http://localhost:8080/parkgarau-ws/ws/park/userlist',
    reader: {
        type: 'json',
        root: 'data'
    }
}
});

从 url，我将成功检索 JSON 格式

{"code":200,"message":"Success","data":"[{\"userName\":\"admin\",\"roleId\":\"SYS_ADMIN\ ",\"fullName\":\"Bibek Shakya\",\"emailId\":\"bibek@drose.com.np\",\"mobileNumber\":\"9843598726\",\"landLineNumber\" :\"014323565\",\"图片\":\"index.jpg\"}]"}

这是我的视图类扩展网格面板

Ext.define('pg.view.security.UsersList', {
extend: 'Ext.grid.Panel',
alias: 'widget.userslist',
frame: true,
store: Ext.create('pg.store.security.Users'), // #1
columns: [
    {
        width: 150,
        dataIndex: 'userName',
        text: 'Username'
    },
    {
        width: 200,
        dataIndex: 'fullName',
        flex: 1,
        text: 'Name'
    }, {
        width: 250,
        dataIndex: 'emailId',
        text: 'Email'
    }
]
 });

这是我的控制器类

Ext.define('pg.controller.security.Users', {
extend: 'Ext.app.Controller',
views: [
    'security.Users' // #1
],
init: function (application) {
    this.control({
        "userslist": {// #2
            render: this.onRender
        }
    });
},
onRender: function (component, options) { // #3
    this.getStore('userStore').load();
}
});

【问题讨论】：

标签： javascript json extjs

【解决方案1】：

我知道问题出在哪里，问题出在 json 格式上，如果格式包含'/'，则无法解决

{
 "code":200,
 "message":"Success",
 "data":"[{\"userName\":\"admin\",\"roleId\":\"SYS_ADMIN\",\"fullName\":\"Bibek Shakya\",\"emailId\":\"bibek@drose.com.np\",\"mobileNumber\":\"9843598726\",\"landLineNumber\":\"014323565\",\"picture\":\"index.jpg\"}]"}

但使用清晰的 json 格式效果很好

[{"userName":"admin","roleId":"SYS_ADMIN","fullName":"Bibek Shakya","emailId":"bibek@drose.com.np","mobileNumber":"9843598726","landLineNumber":"014323565","picture":"index.jpg"}]

【讨论】：

不是因为\"。这是因为您用双引号将数组 [....] 括起来。
@Thevs 我看不懂，是服务器的格式，Response(code,msg,data),
@B'bekShakya 请显示用于 JSON 生成的服务器端代码。有问题。
@Alexander 第一个
@B'bekShakya 请在使用前使用 JSON 验证器检查您的 JSON。