[[383405]]

想了解更多內(nèi)容，請(qǐng)?jiān)L問：

51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)

https://harmonyos.51cto.com

在應(yīng)用開發(fā)時(shí)，我們常需要將一些數(shù)據(jù)緩存到本地，以提升用戶體驗(yàn)。比如在一個(gè)電商的app中，如果希望用戶登錄成功后，下次打開app可以自動(dòng)登錄，就需要將用戶信息存儲(chǔ)到緩存中。

鴻蒙JS開發(fā)模式提供了操作數(shù)據(jù)緩存的API，首先需導(dǎo)入storage模塊。

import storage from '@system.storage'; 

添加緩存的API為storage.set( )，指定key和value，在用戶登錄成功后將用戶名和密碼緩存到本地：

// 登錄 
    login() { 
        fetch.fetch({ 
            url: this.url + "/user/login?phone=" + this.phone + "&pwd=" + this.pwd, 
            responseType: "json", 
            success: res => { 
                let data = JSON.parse(res.data); 
                console.info(JSON.stringify(data)); 
                if (0 != data.code) { 
                    prompt.showToast({ 
                        message: data.msg, 
                        duration: 3000 
                    }) 
                } else { 
                    let userInfo = data.data; 
                    ...... 
                    // 寫入緩存 
                    storage.set({ 
                        key: "userPhone", 
                        value: userInfo.mobile 
                    }); 
                    storage.set({ 
                        key: "userPwd", 
                        value: userInfo.password 
                    }) 
                } 
            } 
        }) 
    }, 

注意，鴻蒙JS的數(shù)據(jù)緩存API是以key:value進(jìn)行存取的，value只能為string類型。如存儲(chǔ)其他類型，并不會(huì)失敗而進(jìn)入fail回調(diào)，但在使用get( )的時(shí)候會(huì)無法取到對(duì)應(yīng)value的。

在進(jìn)入app時(shí)，便可調(diào)用storage.get( )取出緩存中的用戶信息，通過給定key，在success回調(diào)中會(huì)返回對(duì)應(yīng)的value。取到用戶信息后并調(diào)用登錄方法實(shí)現(xiàn)自動(dòng)登錄功能。

onShow() { 
      // 從其他頁(yè)面跳轉(zhuǎn)回來，清除頁(yè)面棧 
      router.clear(); 
      // 從緩存取用戶信息，自動(dòng)登錄 
      storage.get({ 
          key: "userPhone", 
          success: data => { 
              if (data) { 
                  this.phone = data; 
                  storage.get({ 
                      key: "userPwd", 
                      success: data => { 
                          if (data) { 
                              this.pwd = data; 
                              this.login(); 
                          } 
                      } 
                  }) 
              } 
          } 
      }) 
      // 查詢購(gòu)物車數(shù)量 
      if (this.userInfo && this.userInfo.id) { 
          this.countCarts(); 
      } 
  }, 

效果如下：

刪除緩存中數(shù)據(jù)的API為storage.delete( )，指定key即可刪除對(duì)應(yīng)數(shù)據(jù)。此方法在IDE中無提示(猜測(cè)是和delete關(guān)鍵詞重復(fù)了)，但經(jīng)實(shí)驗(yàn)是可以正常使用的。

在用戶退出登錄后，應(yīng)清除緩存中的用戶信息。對(duì)應(yīng)方法如下：

// 退出登錄 
  exitLogin() { 
      prompt.showDialog({ 
          title: "提示", 
          message: "確認(rèn)退出登錄嗎?", 
          buttons: [ 
              { 
                  text: "確定", 
                  color: "#E20A0B" 
              }, 
              { 
                  text: "取消", 
                  color: "#666666" 
              } 
          ], 
          success: res => { 
              if (res.index == 0) { 
                  ...... 
                  // 刪除緩存中用戶信息 
                  storage.delete({ 
                      key: "userPhone" 
                  }); 
                  storage.delete({ 
                      key: "userPwd" 
                  }); 
                  this.userInfo = null; 
              } 
          } 
      }) 
  } 

退出登錄過后再次進(jìn)入app，就不會(huì)自動(dòng)登錄了：

此外還有storage.clear( )方法用于清空所有的數(shù)據(jù)緩存。

微信小程序提供了類似的操作數(shù)據(jù)緩存的方法，分為同步方法和異步方法，且數(shù)據(jù)的value可為任何能夠通過JSON.stringify序列化的對(duì)象。因此在從微信小程序切換到鴻蒙JS開發(fā)時(shí)，在數(shù)據(jù)緩存這里踩了坑。鴻蒙storage的value只能為string，但其提供了文件存儲(chǔ)，擁有更強(qiáng)大的數(shù)據(jù)存儲(chǔ)能力。

想了解更多內(nèi)容，請(qǐng)?jiān)L問：

51CTO和華為官方合作共建的鴻蒙技術(shù)社區(qū)

https://harmonyos.51cto.com