crop-select-js 是一个 Node.js 的 npm 包，用于在前端实现图片的裁剪。它提供了一个简单易用的 API，只需传入图片地址，即可生成一个裁剪框，选定图片区域即可裁剪。
如何安装
在终端中输入以下命令进行安装：
npm install crop-select-js
如何使用
- 引入依赖：
import CropSelect from 'crop-select-js';
- 初始化 CropSelect：
-- -------------------- ---- -------
----- ---------- - --- ------------------------------ -
---------- -------------- -
---------------------- ------
--
----------- -------------- -
---------------------- ------
--
----------- -------------- -
---------------------- ------
--
---- 配置参数：
onCropEnd：当裁剪框启动时执行的回调onCropMove：每当裁剪框移动时执行的回调onCropStop：当裁剪框停止移动时执行的回调
- 裁剪图片：
-- -------------------- ---- ------- ----------------- -- ---- -- ---- ------ ---- ------- ---- -------- ---- ----- ------ ---------------------- - ------------------ ---
x：裁剪框左上角 x 坐标y：裁剪框左上角 y 坐标width：裁剪框宽度height：裁剪框高度quality：裁剪后图片质量type：裁剪后图片类型
示例代码
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
--------------------- ---------------
-------
------
---- ------------------------
---- --------------- ------------
------
------- --------------
------ ---------- ---- -----------------
----- ---------- - --- ------------------------------ -
---------- -------------- -
---------------------- ------
--
----------- -------------- -
---------------------- ------
--
----------- -------------- -
---------------------- ------
--
---
-----------------
-- ----
-- ----
------ ----
------- ----
-------- ----
----- ------
---------------------- -
------------------
---
---------
-------
-------学习与指导意义
crop-select-js 可以帮助前端开发者快速实现图片裁剪的功能，提高开发效率。其提供的 API 简单易用，可根据不同的需求进行自定义配置。此外，学习该库的源代码可以提高对前端的理解和实践能力。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055ea081e8991b448dbf59