yoyo930021 / vc2c

The vc2c project can convert vue class APIs to vue composition APIs in Vue.js components written in Typescript.
https://yoyo930021.github.io/vc2c/
MIT License
87 stars 20 forks source link

fix: ref for non-primitive types #51

Closed imslepov closed 4 months ago

imslepov commented 4 months ago

Declaring state using reactive you cannot replace replace entire object as it worked in Vue 2. This causes a bug when assigning a new state:

import { reactive } from 'vue'
export default {
  props: {},
  name: 'MyComponent',
  setup(props, context) {
    const users = reactive([])

    const fetchUsers = async () => {
      // 
      // Cannot assign to 'users' because it is a constant.
      // 
      users = await fetch(
        'https://jsonplaceholder.typicode.com/users'
      ).then((response) => response.json())
    }

    return { users, fetchUsers }
  },
}

I suggest wrapping all types in ref, not just primitives.