Go WebAssembly响应JavaScript事件及IndexedDB回调实现方法问询

实现方案 #

你要实现的JS代码中给request.onsuccess绑定回调的逻辑，在Go WASM环境下等价于用js.FuncOf创建回调函数，再赋值给request对象的对应属性即可，和你之前添加事件监听器的逻辑完全一致。

完整实现代码如下：

//go:build js && wasm
package main

import (
	"fmt"
	"syscall/js"
)

// 提前声明已打开的IndexedDB实例，类型为js.Value，需保证执行删除前db已初始化完成
var db js.Value

func removeEmployee() {
	// 等价JS: db.transaction(["employee"], "readwrite")
	tx := db.Call("transaction", js.ValueOf([]interface{}{"employee"}), "readwrite")
	// 等价JS: .objectStore("employee")
	store := tx.Call("objectStore", "employee")
	// 等价JS: .delete("00-03")
	request := store.Call("delete", "00-03")

	// 构建onsuccess回调
	var successCb js.Func
	successCb = js.FuncOf(func(this js.Value, args []js.Value) interface{} {
		// args[0]即为触发的success事件对象
		js.Global().Call("alert", "Kenny's entry has been removed from your database.")
		// 单次触发后释放回调资源，避免WASM内存泄漏
		successCb.Release()
		return nil
	})
	// 绑定回调到request的onsuccess属性
	request.Set("onsuccess", successCb)

	// 可选：新增错误回调处理异常
	var errCb js.Func
	errCb = js.FuncOf(func(this js.Value, args []js.Value) interface{} {
		event := args[0]
		fmt.Println("删除失败：", event.Get("target").Get("error").String())
		errCb.Release()
		return nil
	})
	request.Set("onerror", errCb)
}

func main() {
	// WASM常驻逻辑
	c := make(chan struct{}, 0)
	// 可选：将删除方法暴露给JS侧直接调用
	js.Global().Set("remove", js.FuncOf(func(this js.Value, args []js.Value) interface{} {
		removeEmployee()
		return nil
	}))
	<-c
}

核心说明 #

• JS中的链式API调用，在Go侧拆分为多次Call调用即可，每一步返回的都是对应JS对象的js.Value实例
• 给异步API的事件属性（如onsuccess/onerror）绑定回调，和DOM事件监听逻辑一致，用js.FuncOf创建回调后通过Set方法绑定到对应属性即可
• 不需要重复触发的回调执行完成后必须调用Release()释放资源，避免内存泄漏

内容的提问来源于stack exchange，提问作者Hasan A Yousef