vue.jsinstance

Access vue instance in lifecycle hooks using vue composition script setup


I need to access the $options property of the vue instance, yet getCurrentInstance().$options is undefined.

<script setup>
console.log(getCurrentInstance().$options) // undefined
</script>

Solution

  • That an instance needs to be accessed in composition API can be XY problem. Setup block is intended to define component instance with variables, which can be accessed in the block.

    In other cases getCurrentInstance function can be used to access internal component instance. It's not a part of Vue public API but is suitable for exotic cases like this one (HMR).

    this from options API corresponds to getCurrentInstance().proxy, it should be:

    <script setup>
    const options = getCurrentInstance().proxy.$options
    </script>
    

    Alternatively, script block with options API can be used together with script setup without relying on internal API, as long as they don't need to access data from each other's scopes.