Question

0

284

Views

How to modify state in reducer.js to cause re-render of component?

There is a component down the line that uses hash but it's not re-rendering every time there is a change in the value of state.hash. How do I modify this code in reducer.js so that when state.hash is updated, the component that uses it is re-rendered from scratch?

import { createSlice } from "@reduxjs/toolkit";


const counterSlice = createSlice({
  name: 'counter',
  initialState: {
    hash: null,
    d: null,
  },
  reducers: {
    update: (state, {payload}) => {
      const {hash, d} = payload
      state.hash = hash
      state.d = d
    }
  }
})

export const {update} = counterSlice.actions

export const {reducer: counterReducer} = counterSlice

Alternatively, how do I change this code that calls the reducer to achieve the same effect?

  store.dispatch(update({hash, d: d.toString()}))

about 4 years ago · Juan Pablo Isaza

1 answers

Answer question

0

Answer question

Find remote jobs

Answer 1 · 2022-06-29T02:26:17.924Z

You can use the useEffect hook to listen for changes to a variable in state and re-render the component when it changes.

useEffect(() => {
  console.log(hash)
},[state.hash])

Reference

0

284

How to modify state in reducer.js to cause re-render of component?

1 answers

0

Find remote jobs

Andres GPT