score:1

Accepted answer

custom hooks are designed to do exactly what you need^ to isolate and reuse its logic. you can read more about building custom hooks in official react documentation. your case is typical case for building custom hook: isolate state, effect and some couple of functions to operate over state in one hook. you can do it this way:

const useorderdata = (initialstate) => {
  const [orderdata, setorderdata] = usestate(initialstate)

  useeffect(() => {
    // load suburb
    setorderdata()
  }, [data.postcode])

  // other effects in case you need them

  const iseditableaddress = orderdata.user.role === 'editor'

  return [orderdata, { iseditableaddress }]
}

you can also add to custom hooks some functions, i change iseditableaddress to variable cause its value will update every time data changing. using hook will looks like this:

const [data, { iseditableaddress }] = useorderdata({})

check this site, there is a lot of custom hook examples


Related Query

More Query from same tag