sciter 触发 JS 类组件的自定义事件的示例

By terrorist at 2022-04-27 • 0人收藏 • 456人看过
import win.ui;
/*DSG{{*/
var winform = win.form(text="aardio form";right=199;bottom=239)
winform.add(
button={cls="button";text="Button";left=32;top=144;right=128;bottom=184;z=1}
)
/*}}*/

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 Hello extends Element{
    	    render(){
    	        return <div class="test">hello</div>
    	    }
    	    
    	    ["on eventName"](evt){
    	        console.log("事件被触发了")
    	        this.innerText = evt.data;
    	    }
    	}
    	document.body.content(<Hello />)
    </script>
    <style type="text/css">
    html,body{ height:100%; margin:0; } 
    </style>
</head>
<body>
</body>
</html>
**/


winform.button.oncommand = function(id,event){
	wb.querySelector(".test").fireEvent("eventName", "来自 aardio 的数据")
}

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


使用场景, 一个自定义事件相当于订阅器, aardio 触发订阅器让 sciter 更新界面


注意:后端通知前端更新界面,不建议这种针对某个前端节点去通知,应该用全局事件, 查看  https://htmlayout.cn/t/21339

4 个回复 | 最后更新于 2022-04-28
2022-04-27   #1

感谢分享

2022-04-27   #2

感谢分享,又学了一招。Sciter功能强大,数据量多就有点吃内存,这点不如过时的HtmlLayout,体积也小得多。

2022-04-28   #3

感谢分享,赞

2022-04-28   #4

回复#2 @onething576 :

你要是把数据都一股脑加载,啥组件都吃内存…

登录后方可回帖

登 录
信息栏
公 告:

专注分享

谢绝纯提问

谢谢合作!
本站域名:HtmLayout.Cn
aardio可以快速开发上位机,本站主要记录了学习过程中遇到的问题和解决办法及aardio代码分享

这里主要专注于aardio学习交流和经验分享.
纯私人站,当笔记本用的,学到哪写到哪.

Aardio 官方站:Aardio官方
Aardio最新功能:Aardio官方更新日志
本 站 主 站:Stm32cube中文网
Sciter中文在线文档Sciter在线学习文档
空间赞助:才仁机械
打赏本站
Loading...