sciter 全局事件应用: 后端向前端发布事件

By terrorist at 2022-05-19 • 0人收藏 • 791人看过

全局事件可用于来自应用程序的本机端(此处为“后端”)的通知,以通知 UI 在 UI 之外发生了某些事情。


在 web.sciter._metaProperty  补充一个函数

publish = function(name, data, post=true){
	var evt = event.BEHAVIOR_EVENT_PARAMS();
	evt.name = name;
	evt.cmd = 0xF0/*CUSTOM*/
	evt.data = valueObject(data);

    var ret,handled = ::Sciter.FireEvent(evt,post,false);
    return ret && handled;
};
import win.ui;
/*DSG{{*/
var winform = win.form(text="aardio form";right=759;bottom=469)
winform.add()
/*}}*/


import web.sciter
import web.sciter.debug

var wb = web.sciter(winform)
wb.attachEventHandler(web.sciter.debug)

wb.html = /**
<!doctype html>
<html>
<head>
   <META http-equiv="Content-Type" content="text/html; charset=utf-8">
    <script>
    class Table extends Element{
    	render(props){
    	    return <table>
    	    	<thead>
    	    		<tr><th>数据</th></tr>
    	    	</thead>
    	    	<tbody>
    	    		{props.list.map( (item)=>{
    	    		    return <tr><td>{item}</td></tr>
    	    		})}
    	    	</tbody>
    	    </table>
    	}    
    }
    
    class App extends Element{
        constructor(props){
            super()
            this.appData = props.appData
        }
        render(){
            if(this.appData){
            	return <div>
            		<span>{this.appData.title}</span>
            		<Table list={this.appData.list} />
            	</div>
            }
			else {
				return <div>初始化中</div>
			}
			
        };
        componentDidMount(){
            // 订阅全局事件
    		this.onGlobalEvent("appOk", (evt) => {
    		    this.componentUpdate({appData:evt.data})
    		})
        }
    }
	document.body.append(<App />)
    </script>
    <style type="text/css">
    html,body{ height:100%; margin:0; } 
    
    </style>
</head>
<body>
</body>
</html>
**/

// 假装读取界面配置
winform.setTimeout( function(){
	// 发布全局事件
	wb.publish("appOk", 
		{
			title="软件名称";
			list = {1;2;3;4;5;6}
		}
	)
}, 500)


winform.show();
win.loopMessage();


参考资料:

https://gitlab.com/sciter-engine/sciter-js-sdk/-/blob/main/samples.sciter/global-events/README.md#scenario-2-backend-frontend-communication


https://gitlab.com/sciter-engine/sciter-js-sdk/-/blob/main/include/sciter-x-host-callback.h#L277

2 个回复 | 最后更新于 2022-05-19
2022-05-19   #1

感谢分享, 

2022-05-19   #2

sciter达人...

登录后方可回帖

登 录
信息栏
 私人小站

本站域名

ChengXu.XYZ

投诉联系:  popdes@126.com



快速上位机开发学习,本站主要记录了学习过程中遇到的问题和解决办法及上位机代码分享

这里主要专注于学习交流和经验分享.
纯私人站,当笔记本用的,学到哪写到哪.
如果侵权,联系 Popdes@126.com

友情链接
Aardio官方
Aardio资源网


才仁机械


网站地图SiteMap

Loading...