使用 react-zmage 放大缩小图片

在上一篇文章里 https://blog.csdn.net/daoerZ/article/details/113542044 ，记录了 CKEditor5-Reactor 经典模式编辑富文本，但图片不支持放大与缩小。实现此功能的方法很多，可以自己写js实现，也可以使用组件，在此介绍一个非常好用的国内开发的组件 react-zmage， https://github.com/Caldis/react-zmage

该组件打开图片的方式有三种，考虑到是要打开CKEditor编辑器中的图片，最好的方式就是使用点击事件触发，通过对编辑器中的图片监听点击事件的方式来实现。编辑器中的图片，都在 <div class="ck ck-editor__main" role="presentation"> 下

所以只需监听该div下的图片即可，代码放在 CKEditor 中的onRead下

            // 富文本编辑器展示
             <p style={
  { maxWidth: 600 }}>
                <CKEditor
                  editor={ClassicEditor}
                  data={ob