前言
react-cropper-demisto 是一款基于 React 的图片裁剪工具，并且内置了调用 Demisto 平台的 API。在前端开发中，经常会有图片上传、裁剪和处理的需求。使用 react-cropper-demisto 可以很方便地实现这些功能。
如何安装
使用 npm 进行安装，执行以下命令即可：
npm install react-cropper-demisto --save
如何使用
- 在你的组件当中引入这个库。
import React from 'react' import ReactDOM from 'react-dom' import Cropper from 'react-cropper-demisto' import 'cropperjs/dist/cropper.css'
- 在你的组件的 render 函数当中，加入 Cropper 组件。其中，imgSrc 是需要进行裁剪的图片地址。
-- -------------------- ---- -------
----- --- ------- --------------- -
-------------------
-------------
---------- - -
------- ----------------------------------
-------- -----
--------- ---
------------ ---
--
------------- - -------------------------
-------------- - --------------------------
-------------- - --------------------------
----------- - -----------------------
-
-----------
--- ----- - ----------------------
-------------- -- ----------------
--- ------ - --- -------------
------------- - --- -- -
---------------
------- ---------------
---
--
-------------------------------------
-
-
------------------- -
--- -------- - --------------------
------------------ - --------------------------------------------------------
----------------- - -------------------------------------------------------
------------------------ - ----------------- - ----
------------------------- - ------------------ - ----
----------------------- - ------------------ - ------------------------- - --
---------------------- - ------------------- - -------------------------- - --
------------------------ ----------
-
----------- -
--------- ------------------------------------- --- -------------
--- ------ - --------------------------------------
---- - -------------------------------
------------------------------
--------------------------- -------
-
-
----------- -
--------------------------- -----
-
-------- -
-----------------
--- --- - -------------------------------------------- - --------------------------------------------------- - ----
---------- -
-------- -
--------------- -------------------
--------- ------------------
-
---------------- -- -
------ ----------------
------------ -- -
------------------
-----------------
---
-
-------- -
------ -
-----
---- -------------------- --------------- ------
--------
------------ -- -------------------------
-----------------------
--------------- ------- ------ --------
---------------
-------------
---------------------
---------------
------------
----------------
------
-
-- -----------------------------------
-- ----------------------------------
------ ------------------------------------
------- -------------------------------------
-
-
--
------
-----
------ ----------- ----------------- --------------------------
------
-----
------- ------------------------------ -------------
------- -------------------------------------
------
-
----------------------------- - - -- ------
-
-------------------------------- --
---- --------- -------------- ---- ------- ----- -----------
-
-
-------
-
------
--
-
-
----------------
---- ---
-------------------------------
--FAQ
Q: react-cropper-demisto 支持哪些属性？
A: react-cropper-demisto 继承了 cropperjs 的所有属性，具体可以参见 https://github.com/fengyuanchen/cropperjs#options 。
Q: react-cropper-demisto 当前的版本是多少？
A: 当前的版本是 1.0.0。
结论
本文介绍了如何使用 react-cropper-demisto 这个库进行图片的上传、裁剪和处理，并且添加了 Demisto 平台的 API 调用。希望通过本文的介绍，可以帮助大家更好地进行前端开发。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005672981e8991b448e3a85