Блог

я не знаю, как это исправить, и мне действительно нужно какое-то объяснение

 import axios from 'axios'; import test from './test'; import '../scss_files/add_product_style.scss'; import '../scss_files/error_popup.scss'; import React, { Component } from 'react';  const defaultState = {   type: '',  sku:'',  name:'',  price:'',  book:'',  size: '',  height: '',  width: '',  length: '',  priceError: '',  typeError: '',  skuError: '',  bookError: ''  }  export default class add_product extends Component {  constructor(props){  super(props);  this.handleChange = this.handleChange.bind(this);  //this.onChangeType = this.onChangeType.bind(this);  this.onChangeAttribute = this.onChangeAttribute.bind(this);  this.onSubmit = this.onSubmit.bind(this);   this.state= defaultState; }  /*onChangeType(e) {  this.setState({  type:e.target.value  }) }*/  onChangeAttribute(e) {  this.setState({  [e.target.name]:e.target.value   }) }  validate = () =gt; {    let typeError = '';  let skuError = '';  let nameError = '';  let priceError = '';  let bookError = '';  let sizeError = '';  let heightError = '';  let widthError = '';  let lengthError = '';    if (!this.state.price.match(/^[0-9] $/)){ /// use the 'match()' method to not allow the 'priceError event'  priceError = 'Please insert a price'; }  if (!this.state.type){  typeError = 'Please select the type'; }  if (!this.state.sku){  skuError = 'Please, insert the sku';  }   if (priceError || typeError || skuError) {  this.setState({priceError,typeError,skuError});  return false;  }     return true;  }  onSubmit(e) {  e.preventDefault();   const isValid = this.validate();   if(isValid) {   const obj = {  type:this.state.type,  sku:this.state.sku,  name:this.state.name,  price:this.state.price,  book:this.state.book ,  size:this.state.size ,  height:this.state.height   'x',   width:this.state.width   'x',  length:this.state.length     }   //clear the form   // axios.post("http://localhost/scandiweb-test/src/backend/insert.php" ,obj)   //.then(res =gt; console.log(res.data));  console.log(obj);   this.setState = (defaultState);   };   }   renderSelectedForm(type) {  switch(type) {      case '1':  return lt;form className = 'weight-style'gt;  lt;label for="fname"gt;Weightlt;/labelgt;  lt;input type="text" name="book"  value = {this.state.book}  onChange={this.onChangeAttribute}gt;lt;/inputgt;  lt;/formgt;      case '2':  return lt;formgt;  lt;label for="fname"gt;Size(MB)lt;/labelgt;  lt;input type="text" name="size"  value = {this.state.size}   onChange={this.onChangeAttribute}gt;lt;/inputgt;  lt;/formgt;;    case '3':  return lt;form gt;  lt;label for="height"gt;Heightlt;/labelgt;  lt;input name="height"   value = {this.state.height}  onChange={this.onChangeAttribute}  /gt;    lt;label for="width"gt;Widthlt;/labelgt;  lt;input name="width"  value = {this.state.width}  onChange={this.onChangeAttribute}   /gt;    lt;label for="length"gt;Lengthlt;/labelgt;  lt;input name="length"   value = {this.state.length}  onChange={this.onChangeAttribute}  /gt;  lt;/formgt;;    default:  return null;      }  }  

В ручном изменении говорится, что setState не является функцией.

я попытался утешить.запишите » тип » из состояния по умолчанию, и он покажет значение выбранной формы, как и должно быть

   handleChange(e) {  this.setState({  [e.target.name]:e.target.value    })  }  

Я искал везде в коде и все еще не мог понять этого.

    render() {  return (  lt;divgt;  lt;div className = 'header2'gt;lt;/divgt;  lt;div className = 'header'gt;lt;/divgt;  lt;h1 className="title"gt;Add Productlt;/h1gt;   lt;div className = 'input_position'gt;     lt;labelgt;SKUlt;/labelgt;  lt;input name = "sku" value = {this.state.sku}  onChange={this.onChangeAttribute}/gt;  lt;small style={{color: "red"}}gt;{this.state.skuError}lt;/smallgt;     lt;labelgt;Namelt;/labelgt;  lt;input name = "name" value = {this.state.name}  onChange={this.onChangeAttribute}/gt;  lt;divgt;{this.state.nameError}lt;/divgt;   lt;labelgt;Pricelt;/labelgt;  lt;input name = "price" value = {this.state.price}  onChange={this.onChangeAttribute}/gt;lt;br/gt;  lt;small style={{color: "red"}}gt;{this.state.priceError}lt;/smallgt;    lt;form gt;  lt;select name="type" value={this.state.type} onChange={this.handleChange}gt;  lt;option value="0" selected="selected"gt;Typelt;/optiongt;  lt;option value="1"gt;Booklt;/optiongt;  lt;option value="2"gt;DVDlt;/optiongt;  lt;option value="3"gt;Furniturelt;/optiongt;  lt;/selectgt;lt;br/gt;  lt;small style={{color: "red"}}gt;{this.state.typeError}lt;/smallgt;    lt;/formgt;  {this.renderSelectedForm(this.state.type)}     lt;button className = 'submit' onClick={this.onSubmit}gt;Submitlt;/buttongt;  lt;/divgt;  lt;/divgt;   ) }  }