在 react-cropper 中设置最小图像分辨率

Question

我正在使用 react-cropper 插件来调整图像大小。我需要提供最小宽度和高度，低于该值图像无法调整大小。此外，最小宽度和高度必须与实际图像大小相关，而不是根据视口图像大小。

         <Cropper
                style={{
                    height: 422,
                    width: "90%",
                    margin: "0 auto",
                    marginTop: 25
                }}
                preview=".img-preview"
                guides={false}
                aspectRatio={16 / 9}
                src={this.state.imageSrc}
                ref="cropper"
                viewMode={1}
                className={classes.CropperCustomize}
                zoomable={false}
            />

Answer 1

           <Cropper
                style={{
                    height: 422,
                    width: "90%",
                    margin: "0 auto",
                    marginTop: 25
                }}
                crop={this.crop}
                draggable={false}
                preview=".img-preview"
                guides={false}
                aspectRatio={16 / 9}
                src={this.state.imageSrc}
                ref="cropper"
                viewMode={1}
                className={classes.CropperCustomize}
                zoomable={false}
            />

 crop = e => {
        if (
            e.detail.width < this.props.cropWidth ||
            e.detail.height < this.props.cropHeight
        ) {
            this.refs.cropper.cropper.setData(
                Object.assign({}, e.detail, {
                    width:
                        e.detail.width < this.props.cropWidth
                            ? this.props.cropWidth
                            : e.detail.width,
                    height:
                        e.detail.height < this.props.cropHeight
                            ? this.props.cropHeight
                            : e.detail.height
                })
            );
        }

        return;
    };

在 react-cropper 中设置最小图像分辨率

Setting minimum image resolution in react-cropper

reactjs

cropperjs