当前位置:   article > 正文

【HarmonyOS】API6使用storage实现轻量级数据存储_鸿蒙api 6数据存储

鸿蒙api 6数据存储

 写在前面

本篇内容基于API6 JS语言进行开发,通过结合轻量级数据存储开发指导的文档,帮助大家完成一个实际的代码案例,通过这个小案例,可以实现简单数据的存储。

参考文档:文档中心

1、页面布局

首先我们编写一个简单的页面布局,页面中只有一个文本和两个按钮,文本用来展示存储的数据结果,按钮用来控制存储和获取数据,代码如下:

  1. <div class="container">
  2. <text>{{content}}</text>
  3. <div class="option">
  4. <button class="button" value="存储" "onclickSave"></button>
  5. <button class="button" value="获取" "onclickGet"></button>
  6. </div>
  7. </div>

2、页面样式

然后我们简单处理一下页面的样式,代码如下:

  1. .container {
  2. flex-direction: column;
  3. justify-content: center;
  4. align-items: center;
  5. margin-top: 20px;
  6. }
  7. .option {
  8. flex-direction: row;
  9. justify-content: center;
  10. align-items: center;
  11. margin-top: 20px;
  12. margin-right: 20px;
  13. }
  14. .button {
  15. font-size: 15px;
  16. text-align: center;
  17. margin-left: 10px;
  18. margin-right: 10px;
  19. width: 200px;
  20. height: 40px;
  21. }

3、页面逻辑

最后,我们来实现页面中的数据存储以及数据获取的逻辑,相关代码参考本文开头部分的官网文档:

  1. import featureAbility from '@ohos.ability.featureAbility'; // 用于获取文件存储路径
  2. import prompt from '@system.prompt';
  3. import storage from '@ohos.data.storage';
  4. export default {
  5. data: {
  6. content: "",
  7. },
  8. onclickSave() {
  9. var context = featureAbility.getContext();
  10. context.getFilesDir().then((filePath) => {
  11. storage.getStorage(filePath + '/mystore').then((storage) => {
  12. // 保存数据到缓存的storage实例中
  13. let getPromise = storage.put('qwe', true);
  14. getPromise.then(() => {
  15. storage.flush();
  16. console.info("jarchie---保存成功");
  17. }).catch((err) => {
  18. console.info("jarchie---保存失败" + err);
  19. })
  20. }).catch((err) => {
  21. console.info("jarchie---获取storage失败" + err);
  22. })
  23. });
  24. },
  25. onclickGet() {
  26. var context = featureAbility.getContext();
  27. context.getFilesDir().then((filePath) => {
  28. storage.getStorage(filePath + '/mystore').then((storage) => {
  29. let getPromise = storage.get('qwe', false);
  30. getPromise.then((value) => {
  31. this.content = value;
  32. console.info("jarchie---" + this.content);
  33. prompt.showToast({
  34. message: this.content,
  35. duration: 1000
  36. })
  37. }).catch((err) => {
  38. console.info("jarchie---" + err);
  39. })
  40. }).catch((err) => {
  41. console.info("jarchie---获取storage失败" + err)
  42. })
  43. });
  44. }
  45. }

4、实现效果

1ce4e574ccbb382356c0a5fa3f8b9a76_377x814.gif%40900-0-90-f.gif

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/小小林熬夜学编程/article/detail/299105
推荐阅读
相关标签
  

闽ICP备14008679号