反应本地动态引用

Question

I am trying to get some measurement from specefic views to see where the view is located. After that I wanna implement a scrollto function.

I am using this code for the handle:

_handleItemClicked = (index) => () => {
  this.sectionItem[index].measure( (fx, fy, width, height, px, py) => {
    console.log('Component width is: ' + width)
    console.log('Component height is: ' + height)
    console.log('X offset to frame: ' + fx)
    console.log('Y offset to frame: ' + fy)
    console.log('X offset to page: ' + px)
    console.log('Y offset to page: ' + py)
  })
}

And I am using this code for the view

renderItem = ({item, index, section}) => (
            <TouchableNativeFeedback ref={view => { this.sectionItem[index] = view; }} onPress={this._handleItemClicked(index)}>
               <View style={styles.itemrow} >
                 <View style={{width:80,marginLeft:10,height:30}}><Text style={{textAlign:'right',color:'#000',opacity:0.9,fontSize:18,marginTop:4}}>{item.title}</Text></View>
                 </View>
               </View>
             </TouchableNativeFeedback>
);

I tried some other methods but so far no luck. I'am always ending with some error. This time its undefined wich is not a object.

looking forward to the answers.

Answer 1

Try this instead:

ref = { view => ( this[`sectionItem${index}`] = view ) }

I am guessing its trying to find sectionItem in scope, but unable to, giving you the undefined error.

If you do it like the above, it puts a ref with an index in this.