Code Pattern Form action

reactForm.js

import React, { Component } from 'react';
class NameForm extends Component
{
    constructor(props) {
        super(props);
        this.state = {name: 'กรุณากรอกชื่อ', facebook: 'กรุณากรอก link facebook'};

        this.handleChange = this.handleChange.bind(this);
        this.handleSubmit = this.handleSubmit.bind(this);
    }

  handleChange(event) {
    //   if(event.target.name == 'name'){
    //         this.setState({name : event.target.value});
    //   }else if(event.target.name == 'facebook'){
    //       this.setState({facebook : event.target.value});
    //   }

    this.setState({ [event.target.name] : event.target.value});

    // console.log(event.target.name, event.target.value);
  }

  handleSubmit(event) {
    event.preventDefault();

    fetch('http://localhost/123', {
        method: 'POST',
        headers: {
            'Accept': 'application/json',
            'Content-Type': 'application/json',
        },
        body: JSON.stringify({
            // name: this.refs.name.value,
            // facebook: this.refs.facebook.value,
            name: this.state.name,
            facebook: this.state.facebook,
        })
    })
  }
    render()
    {
        return (
      <form onSubmit={this.handleSubmit}>
            <label> Name:
                <input type="text" ref='name' name='name' placeholder={this.state.name} onChange={this.handleChange} />
                <input type="text" ref='name' name='facebook' placeholder={this.state.facebook} onChange={this.handleChange} />

            </label>
            <input type="submit" value="Submit" />

      </form>

        );
    }
}
export default NameForm