1

I'm builiding a local storage for my data for a Vue + Laravel SPA app.

The storage looks as such:

const Storage =
{
    handler:
    {
        get: function(o, prop)
        {
            return localStorage.getItem('storage.data.' + prop)
        },
        set: function(o, prop, value)
        {
            localStorage.setItem('storage.data.' + prop, value)
        }
    }
}

Vue.prototype.$storage = new Proxy(Storage, Storage.handler)

Fairly simple, I would say.

The issue I'm having is, I want the code below to create all neccessary objects as it goes through:

this.$storage.auth.token.kohen = 'test'

To put more bluntly, I want objects auth and token to be created when I set kohen, so I don't have to do:

this.$storage.auth = {}
this.$storage.auth.token = {}

The problem with that is, it runs get on auth first - which also returns undefined.

JTinkers
  • 1,631
  • 9
  • 18
  • `$storage.auth.token.kohen` is not a property of `$storage` however `$storage.auth` is. Try to print what `prop` is to fully understand how the proxy works – Vivick Feb 14 '20 at 09:45
  • You can also have a look at this solution on [How to use javascript proxy for nested objects](https://stackoverflow.com/a/41300128/7316365) – Vivick Feb 14 '20 at 09:47
  • @Vivick So, I should use proxies for nested objects aswell and just keep track of a parent? – JTinkers Feb 14 '20 at 09:47

0 Answers0