你是对的，你不能直接在renderItem回调中使用钩子，但是你可以创建自己的 Package 器组件并调用它：

const Item = ({ item }) =>
  {
    return (
      <View key={item.id} style={containerStyle}>
        <TouchableOpacity>
          <Image
            source={{ uri: item.uri }}
            style={memoizedStyles.media}
          />
        </TouchableOpacity>
      </View>
    );
  };

  ...

    const renderItem = React.useCallback(({ item, index }) => <Item item={item} />);
  ...

就获得项目大小而言，您当然可以使用useRef和ref.measure(...)来完成此操作，但正如React Native文档所指出的，使用onLayout属性可以更快、更容易地获得结果。

const Item = ({ item }) =>
  {
    const [coords, setCoords] = useState();
    return (
      <View key={item.id} style={containerStyle}
        onLayout={ e => setCoords(e.nativeEvent.layout) }>
          ...

coords最初将是未定义的，但是一旦每个Item渲染/重新渲染，coords将包含{x,y,left,top,width,height}。

• • 编辑1**

因此，x和y值是相对于每个项目的视图容器，并不是超级有用的，对不起!
看起来react-native-web还在LayoutEvent中提供了left和top值，这些值在其他平台上是不可用的。因此，我们应该使用.measure(..)：

const Item = ({ item }) =>
  {
    const [coords, setCoords] = useState();
    const ref = useRef();
    useEffect(() =>
      ref.current.measure(
        (x, y, width, height, pageX, pageY) =>
           setCoords({ width, height, pageX, pageY })
      ),
      [ref,setCoords]);

    return (
      <View key={item.id} style={containerStyle} ref={ref}>
        ...

pageX/pageY-页面上的绝对坐标，还有measureLayout()函数可以给你相对于另一个组件的坐标。