реагировать POST формы выборки

Question

У меня есть реактивный компонент с формой, и я хочу отправлять и удалять данные по идентификатору.Теперь я не могу отправить форму, я использую Fetch POST и собираю данные в формате JSON с именем даты, например {data: {name: 'test name'}}

то, что я пропустил, здесьмой код и если нетрудно описать или дать ссылку на статью как удалить по id

class NewRecord extends Component {
constructor(props) {
    super(props);

    this.state = {
        name: '',
        phone: '',
        address: ''
    };

    this.handleNameChange = this.handleNameChange.bind(this);
    this.handlePhoneChange = this.handlePhoneChange.bind(this);
    this.handleAddressChange = this.handleAddressChange.bind(this);

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

handleSubmit(event) {
    event.preventDefault();

    let data = {
        name: this.state.name,
        phone: this.state.phone,
        address: this.state.address
    };

    if (this.state.name !== '' && this.state.phone !== '' && this.state.address !== '') {
        console.log('name', this.state.name, 'phone ', this.state.phone, 'address ', this.state.address);

        fetch("example.com/:id", {
            method: 'POST',
            headers: {
                'Accept': 'application/json',
                'Content-Type': 'application/json',
            },
            mode: "cors",
            body: JSON.stringify(data)
        })
            .then(response => response.json())
            .then(data => console.log(data))
            .catch(error => console.log(error));

    } else {
        alert('no')
    }
}

handleNameChange(event) {
    console.log('handleNameChange', this);
    this.setState({name: event.target.value});
}

handlePhoneChange(event) {
    console.log('handleNameChange', this);
    this.setState({phone: event.target.value});
}

handleAddressChange(event) {
    console.log('handleNameChange', this);
    this.setState({address: event.target.value});
}

render() {
    return (
        <form className='form__row' method='POST' onSubmit={this.handleSubmit}>
            <input
                type="text"
                placeholder="NAME"
                value={this.state.name}
                onChange={this.handleNameChange}
            />
            <input
                type="text"
                placeholder="PHONE"
                value={this.state.phone}
                onChange={this.handlePhoneChange}
            />
            <input
                type="text"
                placeholder="ADDRESS"
                value={this.state.address}
                onChange={this.handleAddressChange}
            />
            <button type='submit'>save</button>
        </form>
    );
}
}

Answer 1

попробуйте вывести

.then(response => response.json())
.then(data => console.log(data))

и просто записать прямой ответ на консоль.

.then(response => console.log(response))

Возможно, вы могли бы также указать, какую строку выдает сообщение об ошибке при отладке.,