React-Inline-Edit
反应的内联编辑。
安装
npm install -S @jswork/react-inline-edit用法
- 导入CSS
@import " ~@jswork/react-inline-edit/dist/style.css " ;
// or use sass
@import " ~@jswork/react-inline-edit/dist/style.scss " ;
// customize your styles:
$react-inline-edit-options : ()- 导入JS
import React , { useState , useEffect } from 'react' ;
import ReactInlineEdit from '@jswork/react-inline-edit' ;
import styled from 'styled-components' ;
import '../../src/components/style.scss' ;
const Container = styled . div `
width: 80%;
margin: 30px auto 0;
` ;
export default ( ) => {
const [ value , setValue ] = useState ( 'Hello inline edit' ) ;
useEffect ( ( ) => {
console . log ( 'value changed:' , value ) ;
} , [ value ] ) ;
return (
< Container >
< ReactInlineEdit value = { value } inputClassName = 'test-cls'
onChange = { ( e ) => setValue ( e . target . value ) } />
Container >
) ;
} ; 预览
- https://afeiship.g*it**hub.io/reeact-inline-edit/
执照
根据MIT许可发布的代码。
下载源码
通过命令行克隆项目:
git clone https://github.com/afeiship/react-inline-edit.git