tauri中从前端ts调用rust函数,并异步收到响应结果

2024-06-22 18:36

本文主要是介绍tauri中从前端ts调用rust函数,并异步收到响应结果,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

在前端是可以异步调用rust代码的,而且还是挺简单的逻辑,一共就三步:定义rust函数,注入到invoke_handler中,在前端调用。有英文能力的可以看官方文档:Calling Rust from the frontend | Tauri Apps

没有英文阅读能力可以看中文文档:Tauri Rust基本示例_w3cschool

定义Rust命令

命令是在 src-tauri/src/main.rs 文件中定义的。 要创建一个命令,只需添加一个函数,并使用 #[tauri::command] 注释:

#[tauri::command]
fn my_custom_command() {println!("I was invoked from JS!");
}

必须向构建器函数提供一个命令列表,如下所示:

// Also in main.rs
fn main() {tauri::Builder::default()// This is where you pass in your commands.invoke_handler(tauri::generate_handler![my_custom_command]).run(tauri::generate_context!()).expect("failed to run app");
}

现在,可以从 JS 代码中调用这个命令:

// When using the Tauri API npm package:
import { invoke } from '@tauri-apps/api/tauri'
// When using the Tauri global script (if not using the npm package)
// Be sure to set `build.withGlobalTauri` in `tauri.conf.json` to true
const invoke = window.__TAURI__.invoke// Invoke the command
invoke('my_custom_command')

 

创建多个命令

tauri::generate_handler!宏接受一个命令数组。要注册多个命令,不能多次调用 invoke_handler。仅使用最后一次调用。必须将每个命令传递给 单个调用。tauri::generate_handler!

#[tauri::command]
fn cmd_a() -> String {"Command a"
}
#[tauri::command]
fn cmd_b() -> String {"Command b"
}fn main() {tauri::Builder::default().invoke_handler(tauri::generate_handler![cmd_a, cmd_b]).run(tauri::generate_context!()).expect("error while running tauri application");
}

优化命令统一管理

可以将这些命令进行统一管理,比如单独报道一个mod里面,然后再从mod里面引入这些命令,这个代码结构更清晰。比如我定义了一个command的mod,然后对外设置为pub:

这样就可以在main.rs里面引入这个mod,并将这个mod里面的函数注册到invoke_handler里面:

在js中调用的时候,依然是调用函数名称即可:

 

这篇关于tauri中从前端ts调用rust函数,并异步收到响应结果的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1085086

相关文章

vite搭建vue3项目的搭建步骤

《vite搭建vue3项目的搭建步骤》本文主要介绍了vite搭建vue3项目的搭建步骤,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学... 目录1.确保Nodejs环境2.使用vite-cli工具3.进入项目安装依赖1.确保Nodejs环境

Nginx搭建前端本地预览环境的完整步骤教学

《Nginx搭建前端本地预览环境的完整步骤教学》这篇文章主要为大家详细介绍了Nginx搭建前端本地预览环境的完整步骤教学,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起学习一下... 目录项目目录结构核心配置文件:nginx.conf脚本化操作:nginx.shnpm 脚本集成总结:对前端的意义很多

Python函数作用域与闭包举例深度解析

《Python函数作用域与闭包举例深度解析》Python函数的作用域规则和闭包是编程中的关键概念,它们决定了变量的访问和生命周期,:本文主要介绍Python函数作用域与闭包的相关资料,文中通过代码... 目录1. 基础作用域访问示例1:访问全局变量示例2:访问外层函数变量2. 闭包基础示例3:简单闭包示例4

前端缓存策略的自解方案全解析

《前端缓存策略的自解方案全解析》缓存从来都是前端的一个痛点,很多前端搞不清楚缓存到底是何物,:本文主要介绍前端缓存的自解方案,文中通过代码介绍的非常详细,需要的朋友可以参考下... 目录一、为什么“清缓存”成了技术圈的梗二、先给缓存“把个脉”:浏览器到底缓存了谁?三、设计思路:把“发版”做成“自愈”四、代码

通过React实现页面的无限滚动效果

《通过React实现页面的无限滚动效果》今天我们来聊聊无限滚动这个现代Web开发中不可或缺的技术,无论你是刷微博、逛知乎还是看脚本,无限滚动都已经渗透到我们日常的浏览体验中,那么,如何优雅地实现它呢?... 目录1. 早期的解决方案2. 交叉观察者:IntersectionObserver2.1 Inter

Vue3视频播放组件 vue3-video-play使用方式

《Vue3视频播放组件vue3-video-play使用方式》vue3-video-play是Vue3的视频播放组件,基于原生video标签开发,支持MP4和HLS流,提供全局/局部引入方式,可监听... 目录一、安装二、全局引入三、局部引入四、基本使用五、事件监听六、播放 HLS 流七、更多功能总结在 v

Python爬虫HTTPS使用requests,httpx,aiohttp实战中的证书异步等问题

《Python爬虫HTTPS使用requests,httpx,aiohttp实战中的证书异步等问题》在爬虫工程里,“HTTPS”是绕不开的话题,HTTPS为传输加密提供保护,同时也给爬虫带来证书校验、... 目录一、核心问题与优先级检查(先问三件事)二、基础示例:requests 与证书处理三、高并发选型:

Python中isinstance()函数原理解释及详细用法示例

《Python中isinstance()函数原理解释及详细用法示例》isinstance()是Python内置的一个非常有用的函数,用于检查一个对象是否属于指定的类型或类型元组中的某一个类型,它是Py... 目录python中isinstance()函数原理解释及详细用法指南一、isinstance()函数

python中的高阶函数示例详解

《python中的高阶函数示例详解》在Python中,高阶函数是指接受函数作为参数或返回函数作为结果的函数,下面:本文主要介绍python中高阶函数的相关资料,文中通过代码介绍的非常详细,需要的朋... 目录1.定义2.map函数3.filter函数4.reduce函数5.sorted函数6.自定义高阶函数

Python中的sort方法、sorted函数与lambda表达式及用法详解

《Python中的sort方法、sorted函数与lambda表达式及用法详解》文章对比了Python中list.sort()与sorted()函数的区别,指出sort()原地排序返回None,sor... 目录1. sort()方法1.1 sort()方法1.2 基本语法和参数A. reverse参数B.