react-hooks 求解,当父级props更新是,state不更新

is_focus 第一次是false, 第二次是true。 如果我不写useEffect的话,is_focus一直都是false,都是第一次的props的内容。 这样正常嘛?必须要在useEffect中 更新props的值?props上面的其他数据也一样,console.log props的数据是更新的,但是useState 之后还是第一次的数据

export default function UserInfo(props: IProps) {
  const [is_focus, setFocus] = useState(props.is_focus)
   // is_focus 第一次是false, 第二次是true。 如果我不写useEffect的话,is_focus一直都是false,都是第一次的props的内容。 这样正常嘛?必须要在useEffect中 更新props的值?
  useEffect(() => {
    setFocus(props.is_focus)
  }, [props.is_focus, props.created_id])
  const handleFocus = useCallback(() => {
    props.dispatch({
      type: `${commonSpace}/changeFollow`,
      payload: {
        uid: props.created_id
      },
      callback: () => {
        setFocus(!is_focus)
      }
    })
  }, [is_focus, props.is_focus, props.created_id])
  return (
    <View className='userInfoBox'>
      <Image className='userAvatar' src={props.src} />
      <Text className='userName'>{props.nickname}</Text>
      <Button
        onClick={handleFocus}
        className={is_focus ? 'userStatus checked' : 'userStatus'}
        hover-class='hover'
      >
        {is_focus ? '已关注' : '关注'}
      </Button>
    </View>
  )
}
阅读 11.4k
2 个回答

是的 useState(...)你可以大致看成是constructor里的东西 组件不卸载重新装在就不会执行了

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏