【Tauri2.0教程(十二)】tauri store插件的使用

前言

本文参考官方文章编写。

store 插件,顾名思义持久化所开发应用的某些数据。比如我现在要做一个应用,需要应用支持切换主题,每次打开APP,需要记住用户之前选择的主题是什么。这时候就需要将选择的主题存储下来。

如果不使用插件,在程序安装目录放置一个配置文件,每次程序启动读取匹配文件中的内容也是可以的。 但是官方既然提供了插件,我们看一下插件是如何使用的。

安装

bash 复制代码
npm run tauri add store

权限配置

src-tauri\capabilities\default.json文件中添加如下权限:

json 复制代码
{
  "permissions": [
    "store:default",
  ]
}

目前新版,安装完插件以后,权限信息是会自动添加进去的,如果没有添加,可以像上面这样手动添加。

使用说明

vue 复制代码
<template>
  <component :is="'style'" v-if="dynamicCss" v-html="dynamicCss"></component>
  <ThemeSelector msg="Readora"/>
</template>

<script setup>
import ThemeSelector from './components/ThemeSelector.vue'
import {onBeforeMount, onMounted, ref} from 'vue';
import {invoke} from '@tauri-apps/api/core';
// 1. 引入方法
import {load} from '@tauri-apps/plugin-store';
import {warn, debug, trace, info, error, attachConsole} from '@tauri-apps/plugin-log';
attachConsole()
const dynamicCss = ref('');
const themeLoadError = ref('');
let store = undefined;
let currentTheme = ref('weread-dark');

onBeforeMount(async () => {
  // 2. 获取store,如果没有settings.json会自动创建
  store = await load('settings.json', {});
  // 3. 读取配置
  const storeTheme = await store.get('currentTheme')
  if (storeTheme) {
    currentTheme.value = storeTheme;
  } else {
    // 4. 写入配置
    await store.set('currentTheme', currentTheme.value)
  }

  // Apply the stored theme
  await applyTheme();
});

// 初始化主题,根据主题名称通过rust加载主题文件夹下面的主题
const applyTheme = async () => {
  try {
    dynamicCss.value = await invoke('load_theme_css', {themeName: currentTheme.value});
    // 更新主题
    await store.set('currentTheme', currentTheme.value)
    info("currentTheme name:[" + currentTheme.value + ']')
  } catch (error) {
    console.error('Error loading theme:', error);
    dynamicCss.value = ''; // Clear CSS on error
    themeLoadError.value = `Error applying theme: ${error}`;
  }
};

上述代码是我在写一个主题切换功能时的代码,包含了读取和写入配置等功能。

相关推荐
Code blocks11 分钟前
GB28181视频服务wvp搭建(二)
后端·音视频
码事漫谈24 分钟前
C++与C#布尔类型深度解析:从语言设计到跨平台互操作
后端
程序新视界38 分钟前
在MySQL中,一条SQL语句的执行全流程是怎样的?
数据库·后端·mysql
lang201509281 小时前
打造专属Spring Boot Starter
java·spring boot·后端
码事漫谈1 小时前
解决Python调用C++ DLL失败的问题:extern "C"的关键作用
后端
码事漫谈1 小时前
从「能用」到「可靠」:深入探讨C++异常安全
后端
码事漫谈1 小时前
深入理解 C++ 现代类型推导:从 auto 到 decltype 与完美转发
后端
码事漫谈1 小时前
当无符号与有符号整数相遇:C++中的隐式类型转换陷阱
后端
盖世英雄酱581362 小时前
java深度调试【第二章通过堆栈分析性能瓶颈】
java·后端
sivdead3 小时前
当前智能体的几种形式
人工智能·后端·agent