Dexie.js query with .equals not working with localStorage

Question

I am trying get a value from indexedDB with Dexie.js but it does not recognize the value from localStorage.

I tried async/await, promises, placing localstorage call on created, mounted, outside export default, and none of these ways worked.

fetchData() {
  return dbDexie.tactics1
    .where('i')
    .equals(localStorage.getItem("id")) // Here is the problem
    .toArray()
    .then((r) => r[0].f);
}

Answer 1

.equals strict equality

The equals method is a strict equality test, so if id is a number type in indexedDB, then the string type returned from localStorage won't match, because of the different types. And localStorage only stores strings.

For this reason, it's common to see JSON.parse used when retrieving data from localStorage, to convert serialized data :

fetchData() {
  return dbDexie.tactics1
    .where('i')
    .equals(JSON.parse(localStorage.getItem("id")))
    .toArray()
    .then((r) => r[0].f);
},

Or you could more explicitly cast the localStorage value to a Number type:

.equals(Number(localStorage.getItem("id")))