1. Introduction

Placeholder prompt for empty state

2. Component structure

3. Core code analysis

3.1 renderfunction

Using the syntactic features of JSX, the rendering logic of each part is handed over to a corresponding independent function. (Highly recommended)

// Image rendering
renderImage = () = > {
	return. }// Blank prompt
renderDescription = () = >{}// Optional button
renderBottom = () = >{}return () = > (
  <div class={bem()}>
  	
    <div class={bem('image')} style={getSizeStyle(props.imageSize)}>
      {renderImage()}
    </div>
    {renderDescription()}
    {renderBottom()}
  </div>
);
Copy the code