Two-way databinding for Input elements for React, close to VueJS

two-way-data-binding-react.tsx

import React, { useState } from 'react'

const bind = (value: string, set: (val: string) => void): Partial<React.InputHTMLAttributes<HTMLInputElement>> => ({
    value,
    onChange: (val) => set(val.currentTarget.value)
})

export const MyComponent = () => {
    const [name, setName] = useState<string>('')
    return (
        <input {...bind(name, setName)} />
    )
}