html图片编辑器插件,js图片编辑器插件Filerobot

Filerobot是一款js图片编辑器插件。Filerobot可以对图片进行修改尺寸,剪裁,旋转,以及使用内置的滤镜对图片进行过滤。

使用方法

eebc480efb2e4870f77ca5b2c2fc76b5.gif

在页面中引入下面的文件。

初始化插件

filerbot的使用方法非常简单,实例化一个ImageEditor对象,然后通过它打开你想要编辑的图片即可。

const ImageEditor = new FilerobotImageEditor();

ImageEditor.open('https://scaleflex.airstore.io/demo/stephen-walker-unsplash.jpg');

作为React组件使用

安装:

$ npm install --save filerobot-image-editor

使用:

import React, { useState } from 'react';

import { render } from 'react-dom';

import FilerobotImageEditor from 'filerobot-image-editor';

const App = () => {

const src = 'https://scaleflex.airstore.io/demo/stephen-walker-unsplash.jpg';

const [show, toggle] = useState(false);

return (

Filerobot Image Editor

%7Bsrc%7D { toggle(true) }} alt="example image"/>

show={show}

src={src}

onClose={() => { toggle(false) }}

/>

)

};

render(, document.getElementById('app'));

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值