twobin / react-lazyload

Lazy load your component, image or anything matters the performance.
MIT License
5.87k stars 488 forks source link

Block with background and internal ref ? #252

Closed golubvladimir closed 5 years ago

golubvladimir commented 5 years ago

What to do with div in internal ref ?

componentDidMount() {
// with re actions
}

/// jsx
...
                    <LazyLoad>
                        <div
                            className='block-item__content'
                            style={{ backgroundImage: `url(${ img })` }}
                        >
                            <TitleElement
                                bold={true}
                                className={'block-item__title'}
                                level={'three'}
                                ref={ref => this._title = ref} // inner ref
                            >{ this.state.title }</TitleElement>
                            {
                                type ?
                                    <Caption className={'block-item__type'}>{ type }</Caption>
                                    : null
                            }
                        </div>
                    </LazyLoad>
golubvladimir commented 5 years ago

Moved ref to a separate component.