[vue3] how do you declare a class property that isn't reactive?

[runxc1]

I can't seem to find any vue3 docs. I'm wanting to basically create a private variable that isn't reactive and hasn't been altered but that I can still use in the class.

[zdevwu]

@runxc1 did you manage to find out any solution?

[zdevwu]

Figured it out, you need to use markRaw or shallowRef, I created an attribute like this for shallowRef so it works better with typing system:

import { shallowRef, makeRaw } from 'vue'

export function ShallowRef () {
  return (target: any, propertyKey: string) => {
    target[propertyKey] = shallowRef(target[propertyKey])
  }
}

class SomeComponent extends Vue {
   @ShallowRef()
   private targetProperty = {some: 'value'}

   private noReactiveAtAll = markRaw({something: 'else' })
}