当父状态更新时，React钩子会更新子级

Question

我在与setState一起传递的父组件中具有钩子，当我通过子对象更新父组件时，它应该重新渲染两者，但事实并非如此。

    // Parent
    const [chosenArticles, setChosenArticles] = React.useState<number[]>([])
    ...
    <ChooseArticles
      setChosenArticles={setChosenArticles}
      chosenArticles={chosenArticles}
     />
    // Child
    export default (props: Props) => {
  const { item, setChosenArticles, chosenArticles } = props
  const checkItem = (articleId: number, check: boolean) => {
    let newArr: number[] = props.chosenArticles
    if (!check) {
      newArr.push(articleId)
    } else {
      newArr = newArr.filter(item => item !== articleId)
    }
    setChosenArticles([...newArr])
  }
  return (
    <ChildComp>
      <ChildTopText>Choose Articles</ChildTopText>
      <ChildInner>
        {item.sub.map((sub: any, i: number) => {
          return (
            <Sub key={i}>
              <ArticleGroup>{sub.name}</ArticleGroup>
              {sub.cats.map((cat: any, i: number) => {
                const isChecked =
                  chosenArticles.filter(c => c === cat.id).length > 0
                    ? true
                    : false
                return (
                  <SubItem key={cat.id}>
                    <CheckBox
                      onPress={() => checkItem(cat.id, isChecked)}
                      checked={isChecked}
                    />
                    <SubName>{cat.name}</SubName>
                  </SubItem>
                )
              })}
            </Sub>
          )
        })}
      </ChildInner>
    </ChildComp>
  )
}

这项工作不应该吗？当我再次手动安装子组件时，它会使用正确的值更新。

我稍后使用状态值在子组件中打勾一个复选框。