useSetState doesn't work

[ilovedesert001]

since update to react 16.8.2
useSetState doesn't work

https://streamich.github.io/react-use/?selectedKind=State%2FuseSetState&selectedStory=Demo&full=0&addons=1&stories=1&panelRight=0

[ilovedesert001]

and this works fine

const useSetState = <T extends object> (initialState: T = {} as any): [T, (patch: Function | Partial<T>) => void] => {
  const [state, set] = useState(initialState)
  const setState = (patch) => {
    if (patch instanceof Function) {
      set((prevState) => {
        return Object.assign({}, state, patch(prevState))
      })
    } else {
      const newState = Object.assign({}, state, patch)
      set(newState)
    }
  }
  return [state, setState]
}

[streamich]

Thanks for reporting this! Should be fixed now.

[ilovedesert001]

it seems still some bugs ...

maybe the better way

typescript

export const useSetState = <T extends object> (initialState: T = {} as any): [T, (patch: Function | Partial<T>) => void] => {
  const [tick,setTick] = useState(true)

  const [state, set] = useState<T>(initialState);
  const setState = patch => {
    if (patch instanceof Function) set(prevState => Object.assign(prevState, patch(prevState)));
    else set(Object.assign(state, patch));
    setTick(!tick)
  };
  return [state, setState];
}

[ilovedesert001]

and this works fine

const useSetState = <T extends object> (initialState: T = {} as any): [T, (patch: Function | Partial<T>) => void] => {
  const [state, set] = useState(initialState)
  const setState = (patch) => {
    if (patch instanceof Function) {
      set((prevState) => {
        return Object.assign({}, state, patch(prevState))
      })
    } else {
      const newState = Object.assign({}, state, patch)
      set(newState)
    }
  }
  return [state, setState]
}

This will cause problems when Passing state (Object) to child Components

[streamich]

This will cause problems when Passing state (Object) to child Components

@ilovedesert001 Can you give an example? Is it because child components mutate the state object?

[ilovedesert001]

check out these

what i expect

this may cause problems

[likun7981]

@ilovedesert001 Why do you use useRef, The returned object will persist for the full lifetime of the component. So a subsequent change is invalid. demo1 is expected, because you assign the patch to state, not create a new object. In fact the state point still has not changed.
.

So in fact there is no need to use the ref
work fine demo

[ilovedesert001]

@likun7981
In my case , I don't want to change state point (Or state Object), just need change state property to cause rerender.

@streamich
Q:Is useSetState designed to change the state point (replaced by new state object), or persist state object for the full lifetime of the component ?

[likun7981]

@ilovedesert001 Every time, the state is a new point(object)

https://codesandbox.io/s/zl1wjo69qx

[streamich]

@likun7981 I think this should be ti.

[likun7981]

@likun7981 I think this should be ti.

These two problems is no relationship

[streamich]

@likun7981 OK, sry.