lvl_up Comments - Answer Overflow

lvl_up

•Created by Carlo Nyte on 7/11/2023 in #support

Best Practice for ContextProvider - Store vs Signals

I'd would opt for the store option. Stores can provide a much simpler syntax/experience to work with multiple properties like you have here. Stores also provide a lot of useful utility functions https://docs.solidjs.com/references/api-reference/stores/store-utilities

export function ContextProvider(props) {
    const [state, setState] = createStore({
        carType: '',
        modelYear: 0,
        warrentyNumber: 0,
        carColor: [],
    });

    return (
        <GlobalContext.Provider value={{ state, setState }}>
            {props.children}
        </GlobalContext.Provider>
    );
}

const { state, setState } = useContext(GlobalContext);

// get store value
state.carType

// set store value
setState('carType', newValue);

export function ContextProvider(props) {
    const [state, setState] = createStore({
        carType: '',
        modelYear: 0,
        warrentyNumber: 0,
        carColor: [],
    });

    return (
        <GlobalContext.Provider value={{ state, setState }}>
            {props.children}
        </GlobalContext.Provider>
    );
}

const { state, setState } = useContext(GlobalContext);

// get store value
state.carType

// set store value
setState('carType', newValue);

It's also much easier to add a property to the store than having to create a new signal for each

export function ContextProvider(props) {
    const [state, setState] = createStore({
        carType: '',
        modelYear: 0,
        warrentyNumber: 0,
        carColor: [],
        // new property
        newProperty: ''
    });
}

export function ContextProvider(props) {
    const [newProperty, setNewProperty] = createSignal('');

    // ... pass signal to context
}

export function ContextProvider(props) {
    const [state, setState] = createStore({
        carType: '',
        modelYear: 0,
        warrentyNumber: 0,
        carColor: [],
        // new property
        newProperty: ''
    });
}

export function ContextProvider(props) {
    const [newProperty, setNewProperty] = createSignal('');

    // ... pass signal to context
}

4 replies

SSolidJS

•Created by lvl_up on 6/20/2023 in #support

Handling rerenders when overwriting state

I think that's exactly what I was looking for. Thanks

5 replies

SSolidJS

•Created by lvl_up on 5/31/2023 in #support

Universal renderer createElement isn't running

I did go through some of the conversations there, and it looks exciting

12 replies

SSolidJS

•Created by lvl_up on 5/31/2023 in #support

Universal renderer createElement isn't running

I'lll take a look at the example you linked as well. Thanks for taking a look!

12 replies

SSolidJS

•Created by lvl_up on 5/31/2023 in #support

Universal renderer createElement isn't running

POCs for a custom renderer for Matter/Pixi mainly for learning purposes.

12 replies

SSolidJS

•Created by lvl_up on 5/31/2023 in #support

Universal renderer createElement isn't running

I was able to get it working eventually. I needed to set a renderer in the solidPlugin config.

export default defineConfig({
  plugins: [
    solidPlugin({
      solid: {
        generate: "universal",
        renderers: [
          {
            name: "universal",
            moduleName: "./renderer",
            elements: [],
          },
        ],
      },
    }),
  ],
  server: {
    port: 3000,
  },
  build: {
    target: "esnext",
  },
});

export default defineConfig({
  plugins: [
    solidPlugin({
      solid: {
        generate: "universal",
        renderers: [
          {
            name: "universal",
            moduleName: "./renderer",
            elements: [],
          },
        ],
      },
    }),
  ],
  server: {
    port: 3000,
  },
  build: {
    target: "esnext",
  },
});

My only issue now, is that typescript is throwing an error on the renderers option. The error says it's not a known property.

12 replies

SSolidJS

•Created by lvl_up on 5/31/2023 in #support

Universal renderer createElement isn't running

All that is being called in my sandbox is the insertNode function on the first div in the <App /> component.

12 replies

SSolidJS

•Created by lvl_up on 5/31/2023 in #support

Universal renderer createElement isn't running

It looks like it might have to do with a missing babel preset configuration. It's mentioned on the universal readme that it's need. I'll see if I can look more into that. https://github.com/solidjs/solid/tree/main/packages/solid/universal

12 replies

Gaming

Programming