我正在使用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}
/>
答案 0 :(得分:0)
<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;
};