前端通过vIEw.window创建新窗口后,如何在新窗口中加载后端数据,主要有两种方法:
1、通过在go里面使用defineFunction定义方法,供前端使用,来获取数据。
2、前端使用vIEw.request请求接口,来获取后端数据。
main.go的代码如下:
package mainimport ( Json2 "enCoding/Json" "github.com/sciter-sdk/go-sciter" "github.com/sciter-sdk/go-sciter/window" "github.com/tIDwall/gJson" "log" "path/filepath")type Person struct { name string `Json:"name"` Age uint8 `Json:"age"`}//定义函数func setWinHandler(w *window.Window) { //定义函数,在tis脚本中需要通过vIEw对象调用 w.defineFunction("getData",func(args ...*sciter.Value) *sciter.Value { Json := args[0].String() //获取前端传来的下标 index := gJson.Get(Json,"index") //数据,这里模拟从数据库中得到的数据 persons := []Person{ { name: "aaa",Age: 11,},{ name: "bbb",Age: 22,{ name: "ccc",Age: 33,} var data []Person if index.Int() == -1 { data = persons } else { data = []Person{persons[index.Int()]} } b,_ := Json2.Marshal(data) return sciter.NewValue(string(b)) })}func main() { //创建window窗口 w,err := window.New(sciter.SW_Titlebar| sciter.SW_RESIZEABLE| sciter.SW_CONTRolS| sciter.SW_MAIN| sciter.SW_ENABLE_DEBUG,nil) if err != nil { log.Fatal(err) } //注意这个地方,sciter较新的版默认的情况下禁用了非安全脚本功能 w.Setoption(sciter.SCITER_SET_SCRIPT_RUNTIME_FEATURES,sciter.ALLOW_file_IO| sciter.ALLOW_SOCKET_IO| sciter.ALLOW_SYSINFO) //加载文件 path,_ := filepath.Abs("./demo1.HTML") w.Loadfile(path) //设置标题 w.SetTitle("你好,世界") //设置窗口处理程序 setWinHandler(w) //显示窗口 w.Show() //运行窗口,进入消息循环 w.Run()}
demo1.HTML代码如下:
<!DOCTYPE HTML><HTML lang="zh-CN"><head> <Meta charset="UTF-8"> <style> .br { wIDth: 100%; border: 1px solID #ccc; margin: 10px auto; } </style></head><body><div > <button ID="win1">窗口</button></div><script type="text/tiscript"> //新窗口 $(#win1).on("click",function() { var win1 = vIEw.window({ type: VIEw.TOol_WINDOW,url: self.url("simple.HTML"),x: 200,y: 200,wIDth: 400,height: 400,clIEnt: false,state: VIEw.WINDOW_SHOWN,//窗口标题 caption: "新窗口",alignment: 3,}); });</script></body></HTML>
simple.HTML的代码如下:
<!DOCTYPE HTML><HTML lang="zh-CN"><head> <Meta charset="UTF-8"> <style> .br { display: inline-block; padding: 2px; border: 1px solID #ccc; background: #fff; text-align: center; } </style></head><body><div> <ul ID="List"> <li></li> </ul> <a href="#" data-index="0">1</a> <a href="#" data-index="1">2</a> <a href="#" data-index="2">3</a> <a href="#" >AJAX</a></div></body><script type="text/tiscript"> vIEw.root.on("ready",function() { //注意这里getData方法,我们是在主窗口注册的 //通过vIEw.window创建的子窗口,我们需要通过vIEw.parent访问父级来调用getData var params = {}; params.index = -1; var data = vIEw.parent.getData(JsON.stringify(params)); //解析从后台传来的数据 data = JsON.parse(data); if (data) { var HTML = ""; for(var (k,v) in data) { HTML += "<li>" + v.name + "---" + v.age + "</li>"; } $(#List).HTML = HTML; } }); self.on("click",".page",function() { var index = this.attributes["data-index"]; var params = {}; params.index = index; var data = vIEw.parent.getData(JsON.stringify(params)); data = JsON.parse(data); if (data) { var HTML = ""; for(var (k,".AJAX",function() { vIEw.request({ type: #get,url: "http://127.0.0.1",protocol: #basic,params: { "test": "test" },//设置返回数据类型为Json output: #Json,//成功回调函数 success: function(data,status) { if (data) { var HTML = ""; for(var (k,v) in data) { HTML += "<li>" + v.name + "---" + v.age + "</li>"; } $(#List).HTML = HTML; } },//失败回调函数 error: function(err,status) { vIEw.msgBox(#alert,err); } }); });</script></HTML>
说明,http://127.0.0.1 返回的数据是我用PHP输出的一些Json数据,可以随便模拟。
结果如下:
总结
以上是内存溢出为你收集整理的go语言使用go-sciter创建桌面应用(九) 通过view.window创建新窗口后,如何加载后端数据全部内容,希望文章能够帮你解决go语言使用go-sciter创建桌面应用(九) 通过view.window创建新窗口后,如何加载后端数据所遇到的程序开发问题。
如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)