如何使用 qx.data.store.Json
how to use qx.data.store.Json
我想知道如何使用 qx.data.store.Json-Store。
就我而言，我有 f.e。这个方法在网络服务中实现：
- 获取用户
- 添加用户
- 删除用户
- 添加文档
- 获取文档
- 删除文档
我现在的问题是：我是否必须创建一个商店（从 qx.data.store.Json 扩展）并实施此方法
喜欢：
var store = new myapp.store.MyJsonStore(url);
var user = store.getUser("testuser");
还是我应该对上述所有方法都使用原来的 qx.data.store.Json？
喜欢：
var store = new qx.data.store.Json("http://localhost:1234/users/testuser");
var user = store.getModel();
在第二种情况下，我必须再次为每个请求创建商店并使其成为 f.e。异步。
托比亚斯
qx.data.store.Json 仅从服务器获取数据。我看不出如何使用 qx.data.store.Json 实现 addUser 或 deleteUser - 无法在商店内部使用的 Xhr 上设置请求数据。来自 qooxdoo 手册："The main purpose of the store components is to load data from a source and convert that data into a model." 那里没有关于写回服务器的内容 - 事实上，唯一明确的读+写存储是离线存储 - 它使用本地存储。
如果我对您的问题的理解正确，您需要使用 qx.io.rest.Resource 在服务器上获取、添加和删除（可能还更新）用户和文档。有了它，您可以将 URL 和 http 动词的组合映射到对用户和文档的服务器端操作。这还允许您设置数据以发送以进行添加和更新等操作。您可以通过侦听资源本身的 success 事件来获取资源上调用的异步操作返回的数据——无论响应中有什么数据，它都将在事件的 data [=28 中=].
然后您可以通过qx.data.marshal.Json自动将事件中包含的JSON转换为qooxdoo对象，然后将生成的模型设置为控制器的模型属性。它将创建与 qx.data.store.
中的商店相同类型的 类
qx.data.store.Json is read-only store implementation. It just sets its model property, which value is converted from JSON (with qx.data.marshal.Json) 从传递给其构造函数的 URL 中检索。通常在 Qooxdoo data-layer 设计中所有连接都是双向的。
可以通过子类化 qx.data.store.Json 使 read-write JSON 存储。它的 model 是普通的 Qooxdoo 数据对象。你可以绑定到它，你可以监听它的变化（商店创建带有冒泡变化的模型）等等。
这里是列表控制器的例子，型号是qx.data.Array。它的 change 事件有类型（添加、删除和其他）。这样你就可以在模型发生变化的时候进行相应的请求。后端是虚拟 RPC 的 CherryPy 应用程序。请注意，这是一个演示代码，它不会处理请求对象、侦听失败事件以及您应该在真实代码中执行的其他操作。
JsonStore.js
qx.Class.define('adhoc.JsonStore', {
extend : qx.data.store.Json,
construct : function(baseUrl, delegate)
{
this.base(arguments, baseUrl + '/list', delegate);
this._baseUrl = baseUrl;
// can't refine model property to set apply method because
// it has not init value
this.addListener('changeModel', this._onChangeModel, this);
},
members : {
_baseUrl : null,
_create : function(entry)
{
var request = new qx.io.request.Xhr(this._baseUrl + '/create');
request.setAccept('application/json');
request.setParser('json');
request.setRequestData(qx.util.Serializer.toNativeObject(entry));
request.addListener('success', this.reload, this);
request.send();
},
_remove : function(entry)
{
var request = new qx.io.request.Xhr(this._baseUrl + '/remove');
request.setAccept('application/json');
request.setParser('json');
request.setRequestData({'id': entry.getId()});
request.send();
},
_onChagneModelDataArray : function(event)
{
var change = event.getData();
if(change.type == 'add')
{
this._create(change.added[0]);
}
else if(change.type == 'remove')
{
this._remove(change.removed[0]);
}
},
_onChangeModel : function(event)
{
var model = event.getData();
model.addListener('change', this._onChagneModelDataArray, this);
}
}
});
Application.js
qx.Class.define('adhoc.Application', {
extend : qx.application.Standalone,
members : {
main : function()
{
this.base(arguments);
if(qx.core.Environment.get('qx.debug'))
{
qx.log.appender.Native;
qx.log.appender.Console;
}
var list = new qx.ui.form.List();
list.setWidth(120);
var controller = new qx.data.controller.List(null, list);
controller.setLabelPath('name');
controller.setLabelOptions({'converter': function(value, model)
{
return model.getId() + ':' + value;
}});
var store = new adhoc.JsonStore('/document');
store.bind('model', controller, 'model');
var create = new qx.ui.form.Button('Create');
create.addListener('execute', function()
{
var name = window.prompt('Enter document name');
if(name)
{
controller.getModel().push(qx.data.marshal.Json.createModel({
'id' : null,
'name' : name
}));
}
});
var remove = new qx.ui.form.Button('Remove');
controller.bind('selection[0]', remove, 'enabled',{'converter':Boolean});
remove.addListener('execute', function()
{
var confirmed = window.confirm('Remove selected document?');
if(confirmed)
{
controller.getModel().remove(controller.getSelection().getItem(0));
}
});
var root = this.getRoot();
root.add(create, {'left': 10, 'top': 10});
root.add(remove, {'left': 70, 'top': 10});
root.add(list, {'left': 10, 'top': 40});
}
}
});
app.py
#!/usr/bin/env python
# -*- coding: utf-8 -*-
import os
import cherrypy
path = os.path.abspath(os.path.dirname(__file__))
config = {
'global' : {
'server.socket_host' : '127.0.0.1',
'server.socket_port' : 8080,
'server.thread_pool' : 8
},
'/static' : {
'tools.staticdir.on' : True,
'tools.staticdir.dir' : os.path.join(path, 'qxjsonstore')
}
}
class Document:
_store = None
def __init__(self):
self._store = {
1 : {'id': 1, 'name': 'foo'},
2 : {'id': 2, 'name': 'bar'},
3 : {'id': 3, 'name': 'baz'},
4 : {'id': 4, 'name': 'qux'},
}
@cherrypy.expose
@cherrypy.tools.json_out()
def list(self):
return self._store.values()
@cherrypy.expose
@cherrypy.tools.json_out()
def create(self, **kwargs):
id = max(self._store.keys()) + 1
self._store[id] = {'id': id, 'name': kwargs['name']}
return id
@cherrypy.expose
@cherrypy.tools.json_out()
def remove(self, id):
del self._store[int(id)]
class App:
document = None
def __init__(self):
self.document = Document()
@cherrypy.expose
def index(self):
return '''<!DOCTYPE html>
<html>
<head>
<!-- Demo is built on qx.js from the framework's build-all job.
Do not use it in real application because it includes all
Qooxdoo classes.
-->
<script type="text/javascript">
var qx = {};
qx.$$environment = {"qx.application": "adhoc.Application"};
</script>
<script type="text/javascript" src="/static/qx.js"></script>
<script type="text/javascript" src="/static/app.js"></script>
</head>
<body></body>
</html>
'''
if __name__ == '__main__':
cherrypy.quickstart(App(), '/', config)
这里是runnable snippet for the demo. Also in case of advanced binding to qx.data.Array beware of bug#8127 which the team doesn't hurry to fix. User-code fix is possible。
我想知道如何使用 qx.data.store.Json-Store。 就我而言，我有 f.e。这个方法在网络服务中实现：
- 获取用户
- 添加用户
- 删除用户
- 添加文档
- 获取文档
- 删除文档
我现在的问题是：我是否必须创建一个商店（从 qx.data.store.Json 扩展）并实施此方法 喜欢：
var store = new myapp.store.MyJsonStore(url);
var user = store.getUser("testuser");
还是我应该对上述所有方法都使用原来的 qx.data.store.Json？ 喜欢：
var store = new qx.data.store.Json("http://localhost:1234/users/testuser");
var user = store.getModel();
在第二种情况下，我必须再次为每个请求创建商店并使其成为 f.e。异步。
托比亚斯
qx.data.store.Json 仅从服务器获取数据。我看不出如何使用 qx.data.store.Json 实现 addUser 或 deleteUser - 无法在商店内部使用的 Xhr 上设置请求数据。来自 qooxdoo 手册："The main purpose of the store components is to load data from a source and convert that data into a model." 那里没有关于写回服务器的内容 - 事实上，唯一明确的读+写存储是离线存储 - 它使用本地存储。
如果我对您的问题的理解正确，您需要使用 qx.io.rest.Resource 在服务器上获取、添加和删除（可能还更新）用户和文档。有了它，您可以将 URL 和 http 动词的组合映射到对用户和文档的服务器端操作。这还允许您设置数据以发送以进行添加和更新等操作。您可以通过侦听资源本身的 success 事件来获取资源上调用的异步操作返回的数据——无论响应中有什么数据，它都将在事件的 data [=28 中=].
然后您可以通过qx.data.marshal.Json自动将事件中包含的JSON转换为qooxdoo对象，然后将生成的模型设置为控制器的模型属性。它将创建与 qx.data.store.
qx.data.store.Json is read-only store implementation. It just sets its model property, which value is converted from JSON (with qx.data.marshal.Json) 从传递给其构造函数的 URL 中检索。通常在 Qooxdoo data-layer 设计中所有连接都是双向的。
可以通过子类化 qx.data.store.Json 使 read-write JSON 存储。它的 model 是普通的 Qooxdoo 数据对象。你可以绑定到它，你可以监听它的变化（商店创建带有冒泡变化的模型）等等。
这里是列表控制器的例子，型号是qx.data.Array。它的 change 事件有类型（添加、删除和其他）。这样你就可以在模型发生变化的时候进行相应的请求。后端是虚拟 RPC 的 CherryPy 应用程序。请注意，这是一个演示代码，它不会处理请求对象、侦听失败事件以及您应该在真实代码中执行的其他操作。
JsonStore.js
qx.Class.define('adhoc.JsonStore', {
extend : qx.data.store.Json,
construct : function(baseUrl, delegate)
{
this.base(arguments, baseUrl + '/list', delegate);
this._baseUrl = baseUrl;
// can't refine model property to set apply method because
// it has not init value
this.addListener('changeModel', this._onChangeModel, this);
},
members : {
_baseUrl : null,
_create : function(entry)
{
var request = new qx.io.request.Xhr(this._baseUrl + '/create');
request.setAccept('application/json');
request.setParser('json');
request.setRequestData(qx.util.Serializer.toNativeObject(entry));
request.addListener('success', this.reload, this);
request.send();
},
_remove : function(entry)
{
var request = new qx.io.request.Xhr(this._baseUrl + '/remove');
request.setAccept('application/json');
request.setParser('json');
request.setRequestData({'id': entry.getId()});
request.send();
},
_onChagneModelDataArray : function(event)
{
var change = event.getData();
if(change.type == 'add')
{
this._create(change.added[0]);
}
else if(change.type == 'remove')
{
this._remove(change.removed[0]);
}
},
_onChangeModel : function(event)
{
var model = event.getData();
model.addListener('change', this._onChagneModelDataArray, this);
}
}
});
Application.js
qx.Class.define('adhoc.Application', {
extend : qx.application.Standalone,
members : {
main : function()
{
this.base(arguments);
if(qx.core.Environment.get('qx.debug'))
{
qx.log.appender.Native;
qx.log.appender.Console;
}
var list = new qx.ui.form.List();
list.setWidth(120);
var controller = new qx.data.controller.List(null, list);
controller.setLabelPath('name');
controller.setLabelOptions({'converter': function(value, model)
{
return model.getId() + ':' + value;
}});
var store = new adhoc.JsonStore('/document');
store.bind('model', controller, 'model');
var create = new qx.ui.form.Button('Create');
create.addListener('execute', function()
{
var name = window.prompt('Enter document name');
if(name)
{
controller.getModel().push(qx.data.marshal.Json.createModel({
'id' : null,
'name' : name
}));
}
});
var remove = new qx.ui.form.Button('Remove');
controller.bind('selection[0]', remove, 'enabled',{'converter':Boolean});
remove.addListener('execute', function()
{
var confirmed = window.confirm('Remove selected document?');
if(confirmed)
{
controller.getModel().remove(controller.getSelection().getItem(0));
}
});
var root = this.getRoot();
root.add(create, {'left': 10, 'top': 10});
root.add(remove, {'left': 70, 'top': 10});
root.add(list, {'left': 10, 'top': 40});
}
}
});
app.py
#!/usr/bin/env python
# -*- coding: utf-8 -*-
import os
import cherrypy
path = os.path.abspath(os.path.dirname(__file__))
config = {
'global' : {
'server.socket_host' : '127.0.0.1',
'server.socket_port' : 8080,
'server.thread_pool' : 8
},
'/static' : {
'tools.staticdir.on' : True,
'tools.staticdir.dir' : os.path.join(path, 'qxjsonstore')
}
}
class Document:
_store = None
def __init__(self):
self._store = {
1 : {'id': 1, 'name': 'foo'},
2 : {'id': 2, 'name': 'bar'},
3 : {'id': 3, 'name': 'baz'},
4 : {'id': 4, 'name': 'qux'},
}
@cherrypy.expose
@cherrypy.tools.json_out()
def list(self):
return self._store.values()
@cherrypy.expose
@cherrypy.tools.json_out()
def create(self, **kwargs):
id = max(self._store.keys()) + 1
self._store[id] = {'id': id, 'name': kwargs['name']}
return id
@cherrypy.expose
@cherrypy.tools.json_out()
def remove(self, id):
del self._store[int(id)]
class App:
document = None
def __init__(self):
self.document = Document()
@cherrypy.expose
def index(self):
return '''<!DOCTYPE html>
<html>
<head>
<!-- Demo is built on qx.js from the framework's build-all job.
Do not use it in real application because it includes all
Qooxdoo classes.
-->
<script type="text/javascript">
var qx = {};
qx.$$environment = {"qx.application": "adhoc.Application"};
</script>
<script type="text/javascript" src="/static/qx.js"></script>
<script type="text/javascript" src="/static/app.js"></script>
</head>
<body></body>
</html>
'''
if __name__ == '__main__':
cherrypy.quickstart(App(), '/', config)
这里是runnable snippet for the demo. Also in case of advanced binding to qx.data.Array beware of bug#8127 which the team doesn't hurry to fix. User-code fix is possible。