Refactor intersection observer article code
This commit is contained in:
		
							parent
							
								
									18a540da9f
								
							
						
					
					
						commit
						b05cda87f8
					
				
					 1 changed files with 13 additions and 14 deletions
				
			
		|  | @ -103,24 +103,23 @@ export default class IntersectionObserverArticle extends ImmutablePureComponent | ||||||
|     const { children, id, index, listLength, cachedHeight } = this.props; |     const { children, id, index, listLength, cachedHeight } = this.props; | ||||||
|     const { isIntersecting, isHidden } = this.state; |     const { isIntersecting, isHidden } = this.state; | ||||||
| 
 | 
 | ||||||
|  |     const style = {}; | ||||||
|  | 
 | ||||||
|     if (!isIntersecting && (isHidden || cachedHeight)) { |     if (!isIntersecting && (isHidden || cachedHeight)) { | ||||||
|       return ( |       style.height = `${this.height || cachedHeight || 150}px`; | ||||||
|         <article |       style.opacity = 0; | ||||||
|           ref={this.handleRef} |       style.overflow = 'hidden'; | ||||||
|           aria-posinset={index + 1} |  | ||||||
|           aria-setsize={listLength} |  | ||||||
|           style={{ height: `${this.height || cachedHeight || 150}px`, opacity: 0, overflow: 'hidden' }} |  | ||||||
|           data-id={id} |  | ||||||
|           tabIndex='0' |  | ||||||
|         > |  | ||||||
|           {children && React.cloneElement(children, { hidden: true })} |  | ||||||
|         </article> |  | ||||||
|       ); |  | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     return ( |     return ( | ||||||
|       <article ref={this.handleRef} aria-posinset={index + 1} aria-setsize={listLength} data-id={id} tabIndex='0'> |       <article | ||||||
|         {children && React.cloneElement(children, { hidden: false })} |         ref={this.handleRef} | ||||||
|  |         aria-posinset={index + 1} | ||||||
|  |         aria-setsize={listLength} | ||||||
|  |         data-id={id} | ||||||
|  |         tabIndex='0' | ||||||
|  |         style={style}> | ||||||
|  |           {children && React.cloneElement(children, { hidden: !isIntersecting && (isHidden || cachedHeight) })} | ||||||
|       </article> |       </article> | ||||||
|     ); |     ); | ||||||
|   } |   } | ||||||
|  |  | ||||||
		Loading…
	
		Reference in a new issue