OiO.lk Community platform!

Oio.lk is an excellent forum for developers, providing a wide range of resources, discussions, and support for those in the developer community. Join oio.lk today to connect with like-minded professionals, share insights, and stay updated on the latest trends and technologies in the development field.
  You need to log in or register to access the solved answers to this problem.
  • You have reached the maximum number of guest views allowed
  • Please register below to remove this limitation

Custom class methods missing from object at runtime

  • Thread starter Thread starter Jamie Marshall
  • Start date Start date
J

Jamie Marshall

Guest
I'm extending Map to create an object for handling data consistantly. However, my custom methods aren't showing up at runtime:

Code:
class DataMap extends Map {
  constructor(...args:any[]) {
    super(...args)
  }
  foo(): void {
    console.log('Foo called...')
  }

  getItems() : object[] {
    return Array.from(this.values())
  }
  static fromValues(values:object[], key:string='id') : DataMap {
    return new DataMap(values.map((_:any) => {
      return [_[key], _]
    }))
  }
  update(map:DataMap){
    const self = this;
    map.forEach((value, key)=>{
      self.set(key, value);
    })
  }
  updateFromList(values:Array<any>, key:string='id'){
    const self = this;
    values.forEach((_:any)=>{
      self.set(_[key], _)
    })
  }
}


export const useTenantStore = defineStore("tenant", () => {
    
  // Fetch Data
  ////////////////////////////////////////////////////////////////////////////////
  const dataStore = useDataStore()
  const client = generateClient<Schema>()
  
  const tenants = ref<DataMap>(new DataMap())
  async function _fetchTenantsByCompany(
    company:Company
  ) : Promise<void> {
    // fetch by company id
    const {data: _tenants, errors} = await client.models.Tenant.list({
        selectionSet: [
        'id','owner_id','first_name', 'last_name', 'business_name', 'is_business',
        'is_active', 'leases.*', 'transactions.*', 'leases.units.*', 
        'transactions.transaction_attributions.*'
        ],
        filter: {
        company_id: {
            eq: company.id
        }
        },
        authMode: 'userPool'
    })
    // tenants.value = _tenants as unknown as Array<FullTenant>
    console.log('map size: ', tenants.value.size) // this works
    tenants.value.foo()  // this throws TypeError: tenants.value.foo is not a function
    tenants.value.updateFromList(_tenants) // this throws TypeError: tenants.value.updateFromList is not a function
  }

  async function load_tenants_by_company(
    force_refresh:Boolean=false
  ) : Promise<void> {
    if (!dataStore.company) {
        await watch_for_dependancy_loaded(()=>dataStore.company, _fetchTenantsByCompany)
    } else if (dataStore.company || force_refresh) {
        await _fetchTenantsByCompany(dataStore.company)
    }
  }

  //////////////////////////////////////////////////////////////////////////////////////////

What am I missing here?

<p>I'm extending <code>Map</code> to create an object for handling data consistantly. However, my custom methods aren't showing up at runtime:</p>
<pre class="lang-js prettyprint-override"><code>class DataMap extends Map {
constructor(...args:any[]) {
super(...args)
}
foo(): void {
console.log('Foo called...')
}

getItems() : object[] {
return Array.from(this.values())
}
static fromValues(values:object[], key:string='id') : DataMap {
return new DataMap(values.map((_:any) => {
return [_[key], _]
}))
}
update(map:DataMap){
const self = this;
map.forEach((value, key)=>{
self.set(key, value);
})
}
updateFromList(values:Array<any>, key:string='id'){
const self = this;
values.forEach((_:any)=>{
self.set(_[key], _)
})
}
}


export const useTenantStore = defineStore("tenant", () => {

// Fetch Data
////////////////////////////////////////////////////////////////////////////////
const dataStore = useDataStore()
const client = generateClient<Schema>()

const tenants = ref<DataMap>(new DataMap())
async function _fetchTenantsByCompany(
company:Company
) : Promise<void> {
// fetch by company id
const {data: _tenants, errors} = await client.models.Tenant.list({
selectionSet: [
'id','owner_id','first_name', 'last_name', 'business_name', 'is_business',
'is_active', 'leases.*', 'transactions.*', 'leases.units.*',
'transactions.transaction_attributions.*'
],
filter: {
company_id: {
eq: company.id
}
},
authMode: 'userPool'
})
// tenants.value = _tenants as unknown as Array<FullTenant>
console.log('map size: ', tenants.value.size) // this works
tenants.value.foo() // this throws TypeError: tenants.value.foo is not a function
tenants.value.updateFromList(_tenants) // this throws TypeError: tenants.value.updateFromList is not a function
}

async function load_tenants_by_company(
force_refresh:Boolean=false
) : Promise<void> {
if (!dataStore.company) {
await watch_for_dependancy_loaded(()=>dataStore.company, _fetchTenantsByCompany)
} else if (dataStore.company || force_refresh) {
await _fetchTenantsByCompany(dataStore.company)
}
}

//////////////////////////////////////////////////////////////////////////////////////////
</code></pre>
<p>What am I missing here?</p>
 

Latest posts

Top