前言
本文是基于rust和tauri，由于tauri是前、后端结合的GUI框架，既可以直接生成包含前端代码的文件，也可以在已有的前端项目上集成tauri框架，将前端页面化为桌面GUI。
环境配置
系统：windows 10
平台：visual studio code
语言：rust、javascript
库：tauri2.0
概述
本文基于tauri框架，创建一个图片显示器程序。要实现的功能是，如何从本地路径加载、显示、保存图片。
前提准备
由于本文涉及到文件选择，但我们不使用html的input元素，而是使用tauri的插件，所以我们需要添加一个文件对话框的库：
npm run tauri add dialog
dialog的用法如下（tauri官方手册）：
比如我们在本文想要实现文件选择，那么就需要打开一个文件对话框，其官方代码如下：
open对话框示例代码
import { open } from '@tauri-apps/plugin-dialog';// Open a dialog
const file = await open({multiple: false,directory: false,
});
console.log(file);
// Prints file path and name to the console
事实上dialog插件可以在javascript和rust中使用，但本文只选择在将javascript中使用，不涉及rust中的使用，详细可以参考tauri官网：
https://v2.tauri.app/zh-cn/plugin/dialog/
1、创建前端项目
此处不再赘述，可以参看我的前一篇博文：
＜tauri＞＜rust＞＜GUI＞基于rust和tauri，在已有的前端框架上手动集成tauri示例
本文将在之前的项目的基础上进行修改。我们将修改之前的计算器布局，添加一个图片选择与显示的前端页面，可以命名为imgshow.html。
imgshow.html
<div class="imgshow"><div id="btnzone"><button id="openfilebtn">加载图片</button><button id="savefilebtn">保存图片</button></div><p id="srcfilepathp">源图片路径：
