Tauri 調用指令

Tauri 為您的前端開發(fā)提供了其他系統(tǒng)原生功能。 我們將其稱作指令，這使得您可以從 JavaScript 前端調用由 Rust 編寫的函數(shù)。 由此，您可以使用性能飛快的 Rust 代碼處理繁重的任務或系統(tǒng)調用。

以下是一個簡單示例：

src-tauri/src/main.rs

#[tauri::command]
fn greet(name: &str) -> String {
   format!("Hello, {}!", name)
}

一個指令等于一個普通的 Rust 函數(shù)，只是還加上了 #[tauri::command] 宏來讓其與您的 JavaScript 環(huán)境交互。

最后，我們需要讓 Tauri 知悉您剛創(chuàng)建的指令才能讓其調用。 我們需要使用 .invoke_handler() 函數(shù)及 Generate_handler![] 宏來注冊指令：

src-tauri/src/main.rs

fn main() {
  tauri::Builder::default()
    .invoke_handler(tauri::generate_handler![greet])
    .run(tauri::generate_context!())
    .expect("error while running tauri application");
}

現(xiàn)在您的前端可以調用剛注冊的指令了！

為了調用我們新創(chuàng)建的命令，我們將使用@tauri-apps/api JavaScript庫。 通過 JavaScript 訪問諸如窗口、文件系統(tǒng)等核心功能， 您可以使用自己喜歡的 JavaScript 包管理器來安裝。

安裝了該庫后，我們現(xiàn)在可以創(chuàng)建一個新的Qwik組件。我們將在src/components/greet/greet.tsx中創(chuàng)建它：

src/components/greet/greet.tsx

import { $, component$, useSignal } from '@builder.io/qwik'
import { invoke } from '@tauri-apps/api/tauri'

export default component$(() => {
  const greetMsg = useSignal('')

  const greet = $(async (name: string) => {
    greetMsg.value = await invoke('greet', { name })
  })

  return (
    <div>
      <button onClick$={() => greet('Qwik')}>Greet</button>
      <p>{greetMsg.value}</p>
    </div>
  )
})

您現(xiàn)在可以將此組件添加到src/routes/index.tsx文件中：

src/routes/index.tsx

// ...
import Greet from '~/components/greet/greet'

export default component$(() => {
  return (
    <>
      <Greet />
      ...
    </>
  )
})

提示
如果您想了解更多關于Rust和JavaScript之間的通信，請閱讀Tauri進程間通信指南。