js图片编辑器插件Filerobot

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

Filerobot-js图片编辑器插件的github网址为：https://github.com/scaleflex/filerobot-image-editor

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

<script  src="js/filerobot-image-editor.min.js.js"></script>

初始化插件

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 (    <div> <h1>Filerobot Image Editor</h1> <img src={src} onClick={() => { toggle(true) }} alt="example image"/>    <FilerobotImageEditor    show={show}    src={src}  onClose={() => { toggle(false) }}  />   </div>    )
};  render(<App/>, document.getElementById('app'));

js图片编辑器插件Filerobot相关推荐

html图片编辑器插件,js图片编辑器插件Filerobot
Filerobot是一款js图片编辑器插件.Filerobot可以对图片进行修改尺寸,剪裁,旋转,以及使用内置的滤镜对图片进行过滤. 使用方法在页面中引入下面的文件. 初始化插件 filerbot的 ...
JS 之图片编辑器插件
今天跟大家分享下JS 之图片编辑器插件的知识. 1 图片编辑器插件Filerobot Filerobot是一款js图片编辑器插件.Filerobot可以对图片进行修改尺寸,剪裁,旋转,以及使用内置的 ...
WdatePicker，js日期插件，时间相加
//WdatePicker,js日期插件 //点击一个日期选择框后,得到日期,然后另一个日期选择框的日期自动加上一天 function pickedFunc(){ $ ...
java mvc 分页查询条件_java分页条件查询-GridManager.js表格插件+Pageable分页对象+mybatis pagehelper分页插件...
总览: 一. GridManager.js表格插件直接上插件API:链接地址感觉该插件简单好用,插件作者也是有问必答,nice 二. 添加依赖后端: pom文件添加: 1.7.0.RELEASE ...
webpack常用的三种JS压缩插件
这里讲解三种JS 打包插件: (1)UglifyJS 支持: babel present2015.webpack3 缺点: 它使用的是单线程压缩代码,也就是说多个js文件需要被压缩,它需要一个个文 ...
Jquery提交表单 Form.js官方插件介绍
來源:http://hi.baidu.com/dereky/blog/item/f9e8ab64c52f4ff3f736540c.html [JQuery框架应用]:form.js官方插件介绍 For ...
js脚本锁计算机软件,JS使用插件cryptojs进行加密解密数据实例
本文实例讲述了JS使用插件cryptojs进行加密解密数据.分享给大家供大家参考,具体如下: Testing websockets var key = 'BOTWAVEE'; //CBC模式加密 fu ...
wordpress 调用css,WordPress折腾记-精简CSS及JS在插件中的调用
GD Star Rating loading... 爱折腾WP是我的一个习惯,不折腾就会手痒,哈哈~~此文仅作为一个精简CSS及JS在插件中调用的范例,其他插件的精简可以按照此文的方法来做. 众所周知 ...
php日期控件calendar.js,轻量级的原生js日历插件calendar.js使用指南
使用说明: 需要引入插件calendar.js/calendar.min.js 须要引入calendar.css 样式表,可以自定义自己想要的皮肤本日历插件支持cmd模块化如下调用:xvDate( ...

js图片编辑器插件Filerobot

初始化插件

作为React组件使用

js图片编辑器插件Filerobot相关推荐

最新文章

热门文章