SolidJSS
SolidJS3y ago
48 replies
Braveheart

Typesafe <Show> only when store has data

the end result I want
  return (
    <Show when={mockDataStore}>
    {mockDataStore.prop} // don't want this to be called giving runtime errors on render when mockDataStore has empty object

I've tried various things like

createStore<StoreType | {}>({}); -> results in ts errors X doesn't exist on {}

re assigning store to previous declarations
    const [mockDataStore2, setMockDataStore2] = createStore<StoreType | {}>({});

    mockDataStore = mockDataStore2;
    setMockDataStore = setMockDataStore2;


the easy way around this is to create store type object of just empty values until the real values come, but that just seems lame :

const mockData: StoreType = {
  companyName: 'Test Company',
  date: new Date(),
  selectType: 'Grocery',
  address: {
    addressLine1: '123 Test Street',
  },
};
  const [mockDataStore, setMockDataStore] = createStore<StoreType | {}>(mockData);
Was this page helpful?