Как создать Mulitwindows в таури (Rust + React + TypeScript + HTML + CSS)? ⇐ Html

[Anonymous]

Я совершенно новичок в Таури и его бэкэнд, ржавчине. Я начал развиваться в Visual Studio, и разработка до сих пор прошла гладко, пока мне не нужно было создать физические окна, когда пользователь должен был быть направлен на другие разделы приложения, такие как настройки или доступ к модели ИИ из фронта приложения. Backend обрабатывается Rust. /> 1. Статически
Окно может быть stataly с помощью добавления записи в раздел : « или блок команды tauri.conf.json , предоставленный crote-tauri-app />tauri.conf.json:

Код: Выделить всё

{
"tauri": {
"windows": [
{
"label": "external",
"title": "Tauri Docs",
"url": "https://tauri.app"
},
{
"label": "local",
"title": "Tauri",
"url": "index.html"
}
]
}
}
< /code>
 подходы времени выполнения < /h1>
 2. Frontend: javascript/typescript 
A [b] Window [/b] может быть открыто, создав экземпляр [b] webview [/b] в фронта.import { WebviewWindow } from '@tauri-apps/api/window'
const webview = new WebviewWindow('theUniqueLabel', {
url: 'path/to/page.html',
})
// since the webview window is created asynchronously,
// Tauri emits the `tauri://created` and `tauri://error` to notify you of the creation response
webview.once('tauri://created', function () {
// webview window successfully created
})
webview.once('tauri://error', function (e) {
// an error occurred during webview window creation
})

typescript:

Код: Выделить всё

import { WebviewWindow } from '@tauri-apps/api/window';

const webview = new WebviewWindow('theUniqueLabel', {
url: 'path/to/page.html',
});

// since the webview window is created asynchronously,
// Tauri emits the `tauri://created` and `tauri://error` to notify you of the creation response
webview.once('tauri://created', () => {
// webview window successfully created
console.log('Webview window successfully created');
});

webview.once('tauri://error', (e) => {
// an error occurred during webview window creation
console.error('Error creating webview window:', e);
});
< /code>
 3. Бэкэнд: Rust 
Создание window [b] [/b] Использование [b] appbuilder :: [/b] struct либо через экземпляр App , [b] app [/b] или [b] tauri Command [/b]: 
app ancessment:  
 
[b] app.tauri::Builder::default()
.setup(|app| {
let docs_window = tauri::WindowBuilder::new(
app,
"external", /* the unique window label */
tauri::WindowUrl::External("https://tauri.app/".parse().unwrap())
).build()?;
let local_window = tauri::WindowBuilder::new(
app,
"local",
tauri::WindowUrl::App("index.html".into())
).build()?;
Ok(())
})
.run(tauri::generate_context!())
.expect("error while running app");

Handle: [/b]

Код: Выделить всё

tauri::Builder::default()
.setup(|app| {
let handle = app.handle();
std::thread::spawn(move || {
let local_window = tauri::WindowBuilder::new(
&handle,
"local",
tauri::WindowUrl::App("index.html".into())
).build()?;
});
Ok(())
})

команды таури:

Код: Выделить всё

\#\[tauri::command\]
async fn open_specific_window(handle: tauri::AppHandle) {
let specific_window = tauri::WindowBuilder::new(
&handle,
"external", /\* the unique window label \*/
tauri::WindowUrl::External("https://tauri.app/".parse().unwrap())
).build().unwrap();
}

Примечание: Командная функция должна быть асинхронной функцией, чтобы избежать тупика в Windows. (См. Этот стек, чтобы увидеть, как этот джентльмен он решил: (я пытаюсь создать новое окно, используя Tauri 1.2, Rust, React и TypeScript. Я сталкиваюсь с некоторыми проблемами)
Мой подход
Я использовал подход , как и другие, это выглядело для меня, как и для того, чтобы я был, был простым, был настолько простым подходом, и это, как и для того, чтобы это было простым. Превосходно, но третьими необходимыми, которые я буду выделять в качестве ответа на этот стек, я хотел использовать третий подход, поскольку я полагал, что он должен был иметь оптимизированную производительность и простую реализацию. /> Я попробовал третий подход, как указано в моих данных о проблеме.

Код: Выделить всё

#[tauri::command]
async fn open_settings_window(app: tauri::AppHandle) {

let file_path = "src-tauri/src/Views/settings.html";

let _settings_window = tauri::WindowBuilder::new(
&app,
"Settings", /* the unique window label */
tauri::WindowUrl::App(file_path.into()),
)
.title("Settings")
.build()
.unwrap();

}

Примечание: мне потребовалось возраст, чтобы выяснить, что tauri :: windowurl :: app () только загружает html . Пожалуйста, используйте html файлы для этого.
Вызовая команду Rust из Frontend
Я позвонил в команду Rust, когда пользователь нажимает на кнопку (id = button).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 open_settings() {
await invoke("open_settings_window") ;
console.log("Window was opened") ;
}
async function greet() {
// Learn more about Tauri commands at https://tauri.app/v1/guides/features/command
setGreetMsg(await invoke("greet", { name }));
}

async function TerminateApplication() {
await invoke("terminate_application") ;
}

return (

Welcome to SSLT!









{
e.preventDefault();
greet();
}}
>
setName(e.currentTarget.value)}
placeholder="Enter a name..."
/>
Greet


{greetMsg}

AI model

Settings

Exit


);
}

export default App;
< /code>
, который правильно вызвал команду Rust и создал файл, запрограммированный в команде Rust. Единственная проблема заключается в том, что на самом деле он не отображает содержимое подключенного типографии в указанном файле HTML.





Tauri + React + TS



Hello





< /code>
Если у кого -то есть эта проблема, пожалуйста, помогите. Я в конце концов получил решение ...

Подробнее здесь: https://stackoverflow.com/questions/777 ... t-html-css