How to use the $persist with Alpine.data()?

[johndwells]

I'm defining a component with Alpine.data(), and wish to persist some of the values of the component. There's no mention of this approach in the docs. I've tried:

Alpine.data('myComponent', () => ({
  myProperty: $persist(false)
}));

But this error is thrown in the browser console: "Uncaught ReferenceError: $persist is not defined at Object"

I've also tried using this.$persist(false) but that throws a different error ("Uncaught TypeError: Cannot read property '$persist' of undefined").

Has anyone gotten this to work?

[SimoTod]

You need to use a standard function.
Alpine needs to bind a custom this to make magics available and in javascript is not possible to re-bind this for arrow functions.

Alpine.data('myComponent', function() {
  return {
    myProperty: $persist(false)
  }
});