Javascript 反应本机-子组件中的功能组件参考

在我的RN组件类的

render（）

中，我调用加载旋转木马的功能组件A。然后，A中的旋转木马在其

renderItem

prop中调用功能组件B。B包含定义为

（this.list=ref）}/>

的平面列表w ref

因此，A在A中定义的onTouch调用中成功访问了

this.list.scrollToIndex（）

。我需要做的是在B中调用

this.list.scrollToOffset（）

，其中定义了FlatList和ref，但当我这样做时，我得到一个错误

TypeError:TypeError:null不是一个对象（计算'\u this.list.scrollToOffset'））

我尝试在类级别使用React.createRef（），但这也不起作用

代码如下：

  //component B
  renderList = () => {
    if (scrollPosition>0) {
        //this call to list fails
        this.list.scrollToOffset({
            offset: scrollPosition
        })
    }
    return (
      <FlatList
        ref={ref => (this.list = ref)}
        ...
      />
    )
  }

  //component A
  renderCarousel = () => {
    return (
        <View style={{ flex: 1 }}>
        <View>
            <TouchableOpacity
            onPress={() => {
                this.list.scrollToIndex({ index: 0 }) //this call to list works
            }}
            >
            </TouchableOpacity>
        </View>
        {
            showList && (
            <Carousel
                renderItem={this.renderList}
            />
            )
        }
        </View>
    )
  }

//B部分
renderList=（）=>{
如果（滚动位置>0）{
//此对列表的调用失败
this.list.scrollToOffset({
偏移量：滚动位置
})
}
返回(
（this.list=ref）}
...
/>
)
}
//A部分
renderCarousel=（）=>{
返回(
{
this.list.scrollToIndex（{index:0}）//对list的调用有效
}}
>
{
展示列表&&(
)
}
)
}

---

我猜我正处在一个奇怪而可怕的js

区域。有什么想法吗？？蒂亚
 很难理解这段代码中的内容
renderList
在我看来像是类中的一个方法，但您将它标记为“组件B”它是组件B中的一个方法吗？那么组件B的功能就不像你说的那样了。不管怎样，每次渲染都调用
this.list.scrollToOffset
，在第一次渲染期间，显然还没有设置ref，因此出现了错误。您应该调用
this.list.scrollToOffset
仅用于响应事件，而不是在每个事件上render@Max是的，错过了尚未渲染的事实-thx