反应原生。无法在地图功能中设置参考

Question

我正尝试使用map函数为每个组件创建一个ref。

这是我的组件：

class Foo extends Component { 

constructor(props) { 
    super(props) 
} 

render() { 
    return (
    <ScrollView> 
    {this.state.barList.map(createSlides)} 
    </ScrollView> 
) 
} 

const createSlides = (uri, i) => (<CarouselItem 
         onPress={() => {}} 
         imgUrl={uri} 
         itemWidth={carouselItemWidth} 
         padding={carouselItemPadding} 
         key={i} 
         ref={(slide) => { this['slide_' + i] = slide}} 
         />); 

正如你看到的，我设置一个ref，但后来尝试访问ref的IT让我undefined时。我的错误在哪里？

Answer 1

尝试把你的Component

class Foo extends Component { 

    constructor(props) { 
    super(props) 
    // make sure this method gets the right scope, no matter how it's called 
    this.createSlides = this.createSlides.bind(this) 
    } 

    render() { 
    return (
     <ScrollView> 
     {this.state.barList.map(this.createSlides)} 
     </ScrollView> 
    ) 
    } 

    createSlides(uri, i) { 
    return (<CarouselItem 
     onPress={() => { }} 
     imgUrl={uri} 
     itemWidth={carouselItemWidth} 
     padding={carouselItemPadding} 
     key={i} 
     ref={(slide) => { this['slide_' + i] = slide }} 
    />) 
    } 
}