利用React特性模拟数据输入

感谢aardio大群:  驴G 分享代码和思路, 收藏备用

主要是react的事件机制特殊,好像是把所有的事件绑在了document对象上

所以光改值的时候会被框架的代码拦截 需要再模拟一个事件让它冒泡传递到document上去

import win.ui;
import web.blink.portable;
import web.blink.form;
/*DSG{{*/
var winform = win.form(cls="AR_FORM";text="react-demo";right=660;bottom=400)
winform.add(
button={cls="button";text="Button";left=554;top=91;right=622;bottom=129;z=2};
custom={cls="custom";text="自定义控件";left=0;top=0;right=520;bottom=400;db=1;dl=1;dr=1;dt=1;z=1}
)
/*}}*/

//关闭窗口前
winform.onClose = function(){
    //先隐藏窗口，别让用户觉得卡
    winform.show(false);
}

var wb = web.blink.form(winform.custom);

//显示窗体
winform.show() 

//创建嵌入HTTP服务器
import wsock.tcp.simpleHttpServer;
wb.go(wsock.tcp.simpleHttpServer.startUrl("/res/index.html"));
/**
wb.go("https://www.baidu.com");
**/
wb.wait();


winform.button.oncommand = function(id,event){
	wb.doScript(`
		let input = document.getElementById("demo")
		let lastValue = input.value;
		input.value = '这里写入你需要的值';

		let event = new Event('input', { bubbles: true });
		// react支持的事件 https://reactjs.org/docs/events.html#supported-events
		// hack React15
		event.simulated = true;
		
		// hack React16 内部定义了descriptor拦截value，此处重置状态
		let tracker = input._valueTracker;

    	if (tracker) {
  			tracker.setValue(lastValue);
		}
		input.dispatchEvent(event);
	
	`);
}

win.loopMessage();