共计 658 个字符,预计需要花费 2 分钟才能阅读完成。
前言
我是歌谣 我有个兄弟 巅峰的时候排名 c 站总榜 19 叫前端小歌谣
已经我花了三年的工夫创作了他 当初我要用五年的工夫超过他
明天又是靠近兄弟的一天人生不免崎岖 大不了从头再来
歌谣的意志是永恒的 放弃很容易 然而保持肯定很酷
需要
明天咱们公司领导找我 说这边有个需要须要你做一下 就是一个 ant design table 外面有个图片
点击的时候给个预览成果 为什么这边叫做伪预览呢 因为其实就是用 ant design 的 model 实现实现的
解决方案
咱们来看一下代码的实现过程
<Button type=”link”
onClick={() =>this.handleRever(row.qrUrl)}> 查看 </Button>
<Modal
style={{textAlign: 'center'}}
visible={this.state.visible}
onOk={this.handleOk}
onCancel={this.handleCancel}
footer={null}
>
<img style={{width: '200px', height: '200px',textAlign: 'center'}}
src={qrUrl}/>
</Modal>
总结
要点 1 点击事件
要点 2 foot={null} 使得上面的分割线暗藏
这样就造成了伪实现了
©著作权归作者所有:来自 51CTO 博客作者前端歌谣的原创作品,如需转载,请注明出处,否则将查究法律责任
私藏我的项目实操分享#【React 工作记录六】如何实现一个图片的伪预览成果
https://blog.51cto.com/u_1447…
正文完