React的useState挂钩的最佳模式是什么？

Question

使用useState React Hook的多个状态变量的最佳模式是什么： 1）为每个单独的状态变量使用单独的setState挂钩？示例：

const [A, setA] = useState( '' );
const [B, setB] = useState( 0 );
const [C, setC] = useState( false );
const [D, setD] = useState( [] );
const [E, setE] = useState( {} );

或

2）使用一个保存所有状态变量的setState挂钩？示例：

const [state, setState] = useState( {
  A: '',
  B: 0,
  C: false,
  D: [],
  E: {},
} );

从可读性和代码清洁性的角度来看，选项1似乎是最佳选择。很好奇，这会表现更好。