Mobx-state-tree: [Question] Error while converting `{}`

Created on 14 Mar 2018  路  4Comments  路  Source: mobxjs/mobx-state-tree

I have this structure:

const PersonData = types.model('PersonData', {
  id: types.maybe(types.number),
  email: types.maybe(types.string),
  firs_name: types.maybe(types.string),
  last_name: types.maybe(types.string),
})

const VisitorOfferData = types.model('VisitorOfferData', {
  status: types.maybe(types.string),
  cookie: types.maybe(types.string),
  fraud_reason: types.maybe(types.string),
  ip_address: types.maybe(types.string),
  person: types.maybe(types.optional(PersonData, {}))
  //person: types.union(types.optional(PersonData, {}), types.null, types.undefined) - not working
  //person: types.frozen -- working
})


export const FriendData = types
  .model('FriendData', {
    journey: types.array(Journey),
    rewards: types.optional(types.array(RewardData), []),
    visitor_offer: types.optional(VisitorOfferData, {})
  })

When I try to describe the structure for person, I get an error:

Uncaught Error: [mobx-state-tree] Error while converting {} to VisitorOfferData: at path "/person" value undefined is not assignable to type: (PersonData | null) (Multiple types are applicable for the union (hint: provide a dispatch function)), expected an instance of (PersonData | null) or a snapshot like ({
  id: (number | null?); email: (string | null?); firs_name: (string |
  null?); last_name: (string | null?) }? | null?) instead.

person can be null || object

Most helpful comment

Now that I think about this, try this if you always want person to be there even when person is null

person: types.optional(PersonData, { 
  id: null;
  email: null;
  firs_name: null;
  last_name: null;
})

or if you just want person to be null or an object then

person: types.maybe(PersonData)

All 4 comments

That's because maybe actually means "value | null" and your object actually has undefined, which is neither

If you want to support also undefined I'd try to add a snapshot conversion

.preProcessSnapshot(snapshot => ({
  ...snapshot, // copy all that is there
  person: snapshot.person === undefined ? null : snapshot.person // transform person from undefined to null if needed
}))

with a plain types.maybe as you have it right there

Now that I think about this, try this if you always want person to be there even when person is null

person: types.optional(PersonData, { 
  id: null;
  email: null;
  firs_name: null;
  last_name: null;
})

or if you just want person to be null or an object then

person: types.maybe(PersonData)

works with: person: types.maybe(PersonData). Thx you.

Now that I think about this, try this if you always want person to be there even when person is null

person: types.optional(PersonData, { 
  id: null;
  email: null;
  firs_name: null;
  last_name: null;
})

or if you just want person to be null or an object then

person: types.maybe(PersonData)

Thanks for the answer

Was this page helpful?
0 / 5 - 0 ratings