1.简介
空状态时的占位提示
2.组件结构
3.核心代码分析
3.1 render函数
利用jsx的语法特性,将每一部分的渲染逻辑交给对应的独立函数处理。
(十分推荐)
// 图片渲染
renderImage = () => {
return ...
}
// 空白提示
renderDescription = () => {
}
// 可选的 按钮
renderBottom = () => {
}
return () => (
<div class={bem()}>
<div class={bem('image')} style={getSizeStyle(props.imageSize)}>
{renderImage()}
</div>
{renderDescription()}
{renderBottom()}
</div>
);