uniapp为什么写入数据无效

为什么uniapp写入数据无效？

在开发过程中，我们经常需要向uniapp的本地存储中写入数据。而有时候我们会发现，明明写入了数据，但是读取或者更新却无法生效。本文将探讨为什么uniapp写入数据无效的原因。

1. uniapp存储方式

uniapp使用的是本地存储方式，而本地存储的值都是以字符串的形式存储的。我们常用的本地存储有三种：localStorage、sessionStorage、cookie。其中，localStorage和sessionStorage是H5新增的本地存储方式，存储值会永久保存在本地，关闭页面或者浏览器后数据不会丢失；而cookie则是HTTP协议用于状态管理的一种机制，存储值会保存在浏览器中，关闭浏览器后数据不会丢失。

2. 存储值的类型问题

在uniapp中，我们经常使用的是JSON字符串来存储数据。但是在实际工作中，我们可能不小心把一个对象类型的值存储到了本地存储中。

const obj = {
  name: 'uniapp',
  version: '2.0.8'
}
uni.setStorageSync('key', obj)

我们比较常用的是uni.setStorageSync()来向本地存储中写入数据。如果我们这样写，数据是不会被存储到本地的。因为uniapp存储数据的时候会转换为字符串类型，而对象是不能直接转换为字符串类型存储的。

如果要写入对象类型的值，需要先将其转换为字符串类型。

const obj = {
  name: 'uniapp',
  version: '2.0.8'
}
uni.setStorageSync('key', JSON.stringify(obj))

这样就能成功将对象存储到本地了。

3. 存储值的大小问题

本地存储是有大小限制的，超出限制就会无法写入。而uniapp的本地存储大小限制是50MB。

如果我们将一个超过50MB的数据写入本地存储中，就会无法写入。而如果我们写入了超过存储限制的数据，它们就不会被存储到本地。这样我们在读取或者更新数据的时候就会发现数据无法生效。

4. 存储值的key问题

在向本地存储中写入数据时，我们需要为它指定一个key。如果我们多次写入同一个key的值，后面的值会顶替掉之前的值。

但是在实际开发中，我们可能会在不同的页面或组件中写入同一个key的值，这时候就可能会出现写入无效的情况。

解决办法是将key值做区分。比如在key值中增加一个组件或页面的标识。

// 在组件中写入数据
uni.setStorageSync('key_component_a', 'value')
// 在页面中写入数据
uni.setStorageSync('key_page_a', 'value')

总结

本文从uniapp的存储方式、存储值的类型、存储值的大小和key值四个方面探讨了为什么uniapp写入数据无效。在实际开发中，仔细排查这四个方面的问题，就能够避免因为存储问题而引起的数据无效的情况。