Home > Software design >  Typescript Vuejs : Type 'Users[]' is missing the following properties from type 'Arra
Typescript Vuejs : Type 'Users[]' is missing the following properties from type 'Arra

Time:01-01

I'm starting typescript with vuejs and I've just come across this error that I've been stuck on for 2 days. The error is as follows: Type 'Users[]' is missing the following properties from type 'ArrayConstructor': isArray, prototype, from, of, [Symbol.species]

And here is my GetAll.controller.ts code:

import { supabase } from "../server";

type Users = {
    user_id: Number,
    user_username: String,
    user_email: String,
    user_password: String,
    user_token: String
}

export async function GetAll():Promise<Users[]> {
    console.log('go');
    
    try {

        let { data, error } = await supabase
            .from('users')
            .select('*')
        if (error) throw error
        if (data) {
            return data
        } else {
            throw data
        }

    } catch (err) { throw(err); }
}

And my App.vue:

<script lang="ts">
import {GetAll} from './API/GetAll.controller';

export default {
  name: 'app',
  data(){
    return {
      users: Array
    }
  },
  async mounted() {
    this.users = await GetAll()
  }
}
</script>

The error is below the this.users inside the mounted()

CodePudding user response:

You should give your users the correct init value, if you don't define the type about users, typescript will treat your init value you assign be the default variable type.

...
  data(){
     return {
      users: [] as Users[]
    }
  }
...

CodePudding user response:

Thanks you so much, it solved, here is the answer :

<script lang="ts">
import {GetAll, Users} from './API/GetAll.controller';

export default {
  name: 'app',
  data(){
     return {
      users: [] as Users[]
    }
  },
  async mounted() {
    this.users = await GetAll()
  }
}
</script>
  • Related