You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
54 lines
1.4 KiB
TypeScript
54 lines
1.4 KiB
TypeScript
import { useState } from "react";
|
|
import reactLogo from "./assets/react.svg";
|
|
import { invoke } from "@tauri-apps/api/tauri";
|
|
import "./App.css";
|
|
|
|
function App() {
|
|
const [greetMsg, setGreetMsg] = useState("");
|
|
const [name, setName] = useState("");
|
|
|
|
async function greet() {
|
|
// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
|
|
setGreetMsg(await invoke("greet", { name }));
|
|
}
|
|
|
|
return (
|
|
<div className="container">
|
|
<h1>Welcome to Tauri!</h1>
|
|
|
|
<div className="row">
|
|
<a href="https://vitejs.dev" target="_blank">
|
|
<img src="/vite.svg" className="logo vite" alt="Vite logo" />
|
|
</a>
|
|
<a href="https://tauri.app" target="_blank">
|
|
<img src="/tauri.svg" className="logo tauri" alt="Tauri logo" />
|
|
</a>
|
|
<a href="https://reactjs.org" target="_blank">
|
|
<img src={reactLogo} className="logo react" alt="React logo" />
|
|
</a>
|
|
</div>
|
|
|
|
<p>Click on the Tauri, Vite, and React logos to learn more.</p>
|
|
|
|
<div className="row">
|
|
<form
|
|
onSubmit={(e) => {
|
|
e.preventDefault();
|
|
greet();
|
|
}}
|
|
>
|
|
<input
|
|
id="greet-input"
|
|
onChange={(e) => setName(e.currentTarget.value)}
|
|
placeholder="Enter a name..."
|
|
/>
|
|
<button type="submit">Greet</button>
|
|
</form>
|
|
</div>
|
|
<p>{greetMsg}</p>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default App;
|