1.开启所有API使用

{   "tauri": {     "allowlist": {       "all": true,    }  }}

2.关闭鼠标右键

window.addEventListener('contextmenu', (e) => e.preventDefault(), false);​// 在生成环境关闭鼠标右键if (import.meta.env.MODE === "production") {   window.addEventListener("contextmenu", (e) => e.preventDefault(), false);}

3.修改图标

①在项目根目录下放入要替换的图标，重命名为 app-icon.png

        ②运行

pnpm tauri icon

4.多窗口

        注意：窗口标签必须是唯一的，并且可以在运行时用于访问窗口实例。此处使用的是在 JavaScript 中创建窗口

        免责声明窗口使用创建新窗口的方法创建出来的，使用时直接导入即可

import {  WebviewWindow } from "@tauri-apps/api/window";​// 创建新窗口export const createWin = (options: any) => {   const webview = new WebviewWindow(options.label, {     url: options.url, // 窗口的URL    title: options.title, // 窗口的标题    width: options.width, // 初始宽度 (number)    height: options.height, // 初始高度 (number)    minWidth: options.minWidth, // 窗口的最小宽度 (number)    minHeight: options.minHeight, // 窗口的最小高度 (number)    maxWidth: options.maxWidth, // 窗口的最大宽度 (number)    maxHeight: options.maxHeight, // 窗口的最大高度 (number)    resizable: options.resizable, // 窗口是否可调整大小 (boolean)    x: options.x, // 窗口左上角的水平位置 (number)    y: options.y, // 窗口左上角的垂直位置 (number)    center: options.center, // 是否位于屏幕中央显示窗口 (boolean)    alwaysOnTop: options.alwaysOnTop, // 窗口是否应始终位于其他窗口之上 (boolean)    fullscreen: options.fullscreen, // 窗口是否应全屏显示 (boolean)    decorations: options.decorations, // 窗口是否应具有装饰边框和条 (boolean)    fileDropEnabled: options.fileDropEnabled, // 窗口是否应接收文件拖放 (boolean)    skipTaskbar: options.skipTaskbar, // 是否将窗口添加到任务栏 (boolean)    contentProtected: options.contentProtected, // 防止窗口内容被其他应用程序捕获 (boolean)    focus: options.focus, // 窗口是否应自动获取焦点 (boolean)    visible: options.visible, // 窗口是否应可见 (boolean)  });​  // 窗口创建成功触发  webview.once("tauri://created", function () {     console.log(options.title + "创建成功！！！");  });​  // 窗口创建失败触发  webview.once("tauri://error", function (e) {     console.log(options.title + "创建失败！！！", e);  });};​// 关闭窗口export const closeWin = (label: string) => {   const win = WebviewWindow.getByLabel(label);  if (win) {     win.close();  } else {     console.error(`无法找到标签为 ${ label} 的窗口`);  }};​// 隐藏窗口export const hideWin = (label: string) => {   const win = WebviewWindow.getByLabel(label);  if (win) {     win.hide();  } else {     console.error(`无法找到标签为 ${ label} 的窗口`);  }};​// 显示窗口export const showWin = (label: string) => {   const win = WebviewWindow.getByLabel(label);  if (win) {     win.show();  } else {     console.error(`无法找到标签为 ${ label} 的窗口`);  }};​// 免责声明窗口export const disclaimerWin = () => {   createWin({     label: "Disclaimer",    title: "免责声明",    url: "/disclaimer",    center: true,    width: 800,    height: 740,    resizable: false,  });};

5.初始屏幕

        如果网页需要一些时间来加载，或者你需要在显示主窗口之前在 Rust 中运行初始化过程，那么启动画面可以改善用户的加载体验。

第一种方法：

        ①首先需要隐藏主窗口 tauri.config.json

"windows": [      {         "fullscreen": false,        "resizable": true,        "title": "有米TG营销助理",        "center": true,        "width": 600,        "height": 400,        "minWidth": 600,        "minHeight": 400,        "visible": false      }    ]

        ②创建初始屏幕，直接在tauri,config.json中创建，如下

"windows": [  {     "title": "Tauri App",    "width": 800,    "height": 600,    "resizable": true,    "fullscreen": false,    "visible": false  },  // Add the splashscreen window  {     "width": 400,    "height": 200,    "decorations": false,    "url": "splashscreen.html",    "label": "splashscreen"  }]

        ③等待网页

use tauri::Manager;// 创建命令：// 该命令必须是异步的，以便它不会在主线程上运行。#[tauri::command]async fn close_splashscreen(window: tauri::Window) {   // 关闭初始屏幕  if let Some(splashscreen) = window.get_window("splashscreen") {     splashscreen.close().unwrap();  }  // 显示主窗口  window.get_window("main").unwrap().show().unwrap();}​// 注册命令：fn main() {   tauri::Builder::default()    // Add this line    .invoke_handler(tauri::generate_handler![close_splashscreen])    .run(tauri::generate_context!())    .expect("failed to run app");}

        ④使用

import {  invoke } from '@tauri-apps/api/tauri'​document.addEventListener('DOMContentLoaded', () => {   // 这将等待窗口加载，但你可以在您想要的任何触发器上运行此函数  invoke('close_splashscreen')})

第二种方法：

        ①首先需要隐藏主窗口 tauri.config.json

"windows": [      {         "fullscreen": false,        "resizable": true,        "title": "有米TG营销助理",        "center": true,        "width": 600,        "height": 400,        "minWidth": 600,        "minHeight": 400,        "visible": false      }    ]

        ②使用创建多窗口，在页面调用创建多窗口的方法

disclaimerWin();

        ③使用定时器或者点击事件关闭初始屏幕，显示主窗口

// 关闭当前窗口closeWin("Disclaimer");​// 显示主窗口showWin("main");

6.打开文件/目录选择对话框

        由于使用的是axios，上传文件无法完成，就是用的该方法，将文件传递给后端

import {  open } from '@tauri-apps/api/dialog';​const selected = await open({   multiple: true,   filters: [{     name: 'Image',    extensions: ['png', 'jpeg']  }]});​if (Array.isArray(selected)) {   // 用户选择多个文件} else if (selected === null) {   // 用户取消文件选择} else {   // 用户选择一个文件}

7.修改窗口

        登录成功需要修改窗口可以使用下面的方法

import {  appWindow, LogicalSize } from '@tauri-apps/api/window';​await appWindow.setResizable(true);  // 是否可以更改该大小await appWindow.setSize(new LogicalSize(1920, 1080));  // 窗口重置宽高await appWindow.setMinSize(new LogicalSize(1920, 1080));  // 窗口重置最小宽高await appWindow.center();  // 窗口居中

8.退出窗口操作

import {  exit } from '@tauri-apps/api/process';​await exit(0);