技术不行但人小帅 2023-02-26 00:37 采纳率: 60.6%
浏览 46
已结题

uniapp页面缓存有什么好方法?

目前切换页面再返回该页面会重新加载数据,太浪费性能,uniapp又没有router-view 的语句有啥好办法啊?或者什么其他缓存的好办法?存本地这种也不太好啊?

  • 写回答

2条回答 默认 最新

  • GISer Liu 2023-02-26 01:32
    关注

    以下答案引用自GPT-3大模型,请合理使用:

    ,劳烦了
    
    1、首先,你可以在当前页面中设置一个`data`对象,里面存储页面数据,如果是跳转到其他页面,你就可以在这个`data`里保存需要的状态,这样跳回来的时候,你才能读取到上次的状态,代码如下:
    
    ```js
    // data.js
    export default {
      data: {
        pageState: '', // 保存页面状态
        pageData: {} // 保存页面数据
      }
    }
    
    // 页面A
    import data from './data.js'
    
    Page({
      data: {
        pageState: data.pageState,
        pageData: data.pageData
      },
      onShow() {
        if (data.pageState) {
          // 如果有数据,就直接从data.js中拿出来
        } else {
          // 否则,就去请求接口拿数据
        }
      }
    })
    

    2、另外,关于uni-app页面缓存,官方也提供了一些api,比如封装uni.setStorageSync()方法,用于将页面状态或者其他数据缓存到本地,后续再访问可以直接从本地拿数据,以节省网络开销。具体用法可以参考官网文档:
    https://uniapp.dcloud.io/ap

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
  • MarkHan_ 2023-02-26 08:07
    关注

    该回答引用GPTᴼᴾᴱᴺᴬᴵ
    在 Uniapp 中实现缓存页面的方法有很多种,下面列举一些可能会有用的方法:

    1. 使用uni-simple-router插件
      uni-simple-router 是一个轻量级的路由插件,它提供了页面缓存功能。通过该插件可以在路由配置中设置需要缓存的页面,当页面被缓存后,在切换到其他页面再返回时,页面将不会重新加载,而是从缓存中读取。使用该插件需要先安装和配置。

    2. 使用vuex进行状态管理
      在Vue.js中,Vuex是一个状态管理库,可以用于全局管理应用程序的状态。可以将需要缓存的数据存储在Vuex中,当页面切换时,从Vuex中读取数据,这样就可以避免页面重新加载的问题。当然,需要考虑存储在Vuex中的数据的大小和影响性能。

    3. 使用localStorage进行本地存储
      localStorage是浏览器提供的本地存储API,可以将数据存储在浏览器中,下次打开应用时可以从localStorage中读取数据。可以将需要缓存的数据序列化后存储在localStorage中,下次打开应用时再反序列化获取数据。但是需要注意,localStorage的存储容量有限制,如果存储数据过大可能会影响性能。

    4. 使用sessionStorage进行会话存储
      sessionStorage与localStorage类似,不同之处在于sessionStorage的存储时间是会话期间,即当用户关闭浏览器窗口或标签页时,数据就会被清除。因此,可以将需要缓存的数据存储在sessionStorage中,当用户切换页面时,从sessionStorage中读取数据。但是需要注意,当用户关闭浏览器窗口或标签页时,数据将会被清除。

    总之,以上是几种比较常用的缓存页面的方法,可以根据实际情况选择适合自己的方法。

    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 2月26日
  • 已采纳回答 2月26日
  • 创建了问题 2月26日

悬赏问题

  • ¥15 IDEA构建失败?怎么搞
  • ¥15 求该题的simpson,牛顿科特斯matlab代码,越快越好
  • ¥30 求解,有偿,可商量价格
  • ¥15 编译arm板子的gcc
  • ¥15 C++代码报错问题,c++20协程
  • ¥15 c++图Djikstra算法求最短路径
  • ¥15 Linux操作系统中的,管道通信问题
  • ¥15 ansible tower 卡住
  • ¥15 等间距平面螺旋天线方程式
  • ¥15 通过链接访问,显示514或不是私密连接