React components for inline form editing
react-inline-forms
allows to transform any bit of html into a form by simply clicking it, while keeping control on how you handle submission and change.
It handles text
and select
inputs.
NPM:
$ npm install react-inline-forms
Yarn:
$ yarn add react-inline-forms
import React, { Component } from 'react'
import { RIInput } from 'react-inline-forms'
class App extends Component {
constructor(props) {
super(props)
this.state = {
name: '',
}
this.handleSubmit = this.handleSubmit.bind(this)
}
handleSubmit() {
// Needs to return a Promise
}
handleChange(e) {
const name = e.target.name
const value = e.target.value
}
render() {
const { name } = this.state
return (
<div>
<RIInput
onFormSubmit={this.handleSubmit}
onInputChange={this.handleChange}
>
<p>{name}</p>
</RInput>
</div>
)
}