更好的方式
不管是单向通讯还是双向通讯,只要是Foxtable端发起的通讯,我都更倾向用ExecuteScriptAsync调用前端js函数,通过参数传递消息给前端,同时通过js函数的返回值接收前端返回的消息,做到传递和接收都在同一行代码完成。
本节示例可以参考示例文件"CaseStudy\WebViewer\发送消息.Table"的窗口"双向通讯"。
1、窗口的AfterLoad事件代码:
'''Async
Dim
wv
As
WebViewer = e.Form.Controls("WebViewer1").WebViewer
Await
wv.EnsureCoreWebView2Async(Nothing)
Dim
html
As
String
=
<![CDATA[
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>JSON参数演示</title>
<style>
body { font-family: 'Microsoft YaHei'; padding: 20px; }
.result { background: #f0f0f0; padding: 15px; border-radius: 5px;
margin-top: 20px; }
</style>
</head>
<body>
<h2>JSON参数传递演示</h2>
<p>前端定义一个函数,接收一个JSON对象参数</p>
<div id="result" class="result">等待调用...</div>
<script>
//
一个简单的函数,接收JSON参数
function showEmployeeInfo(employee) {
let message = `收到JSON参数:\n`
+
`姓名:${employee.name}\n`
+
`年龄:${employee.age}\n`
+
`薪水:${employee.salary}元\n`
+
`职务:${employee.title
|| '无'}`;
//
显示在页面上
document.getElementById('result').innerText =
message;
//
返回给调用方
return `你好,${employee.name},你的薪水是${employee.salary}元`;
}
</script>
</body>
</html>
]]>.Value
wv.NavigateToString(html)
这个页面的js脚本定义了一个函数showEmployeeInfo,其参数employee是一个json对象
2、Foxtable调用这个函数的参考代码为:
'''Async
Dim
wv
As
WebViewer = e.Form.Controls("WebViewer1").WebViewer
'
这里用ExpandoObject,你用匿名对象、JObject或字典都是可以的
Dim
emp
As
Object
=
New
ExpandoObject()
emp.name =
"张三"
emp.age = 30
emp.salary = 8500.50
emp.title =
"工程师"
Dim
jsonEmp = JsonConvert.SerializeObject(emp)
'
序列化为JSON字符串
Dim
js = CExp("showEmployeeInfo({0});",
jsonEmp)
'
调用前端函数,传递JSON参数
Dim
result
As
String
=
Await
wv.ExecuteScriptAsync(js)
'消息的传递和接收只需一行代码
result =
result.Trim("""")
'前端函数返回的字符串是JSON格式,有双引号,使用前必须去掉,切记
MessageBoxA.Show("函数返回:
"
& result,
"调用结果")