Может ли кто-нибудь объяснить мне, как работает привязка модели в ASP.NET?

Я пытаюсь выполнить почтовый запрос из Reactjs в ASP.NET API, используя axios. Сначала я получил ошибку 400 Bad request. Но после того, как я изменил DTO в серверной части, это сработало, но полученные данные были пустыми или нулевыми (я думаю, это одна из тех ошибок привязки модели). Это мой файл React.Js:

const defaultImgPath = '/assets/ImgStarter.jpg';
const initialFieldValues = {
  productName: 'Fried spring rolls',
  productPrice: 50000,
  productStatus: 1,
  productDescription: 'A short description',
  imagePath: defaultImgPath,
  imgName: '',
  ProductImg: null
}

const ApiUploadImg = () => {
  const [input, setInput] = useState(initialFieldValues) 
  const handleAddProduct = (e) => {
    e.preventDefault();
    axios.post('http://localhost:5273/api/product', input)
    .then((response) => {
      console.info(response);
    })
    .catch((error) => {
      console.info(error.response);
    })

return (
    <div className='form-uload'>
      <form className='p-5' onSubmit = {handleAddProduct}>
        <Input
          inputType = "text"
          labelname = "Product name"
          name = "productName"
          setInput = {setInput}
          input = {input}
        />
        <Input
          inputType = "number"
          labelname = "Price"
          name = "productPrice"
          setInput = {setInput}
          input = {input}
        />
        <Input
          inputType = "text"
          labelname = "Status (Is available?)"
          name = "productStatus"
          setInput = {setInput}
          input = {input}
        />
        <Input
          inputType = "text"
          labelname = "Description"
          name = "productDescription"
          setInput = {setInput}
          input = {input}
        />
        <Input
          inputType = "file"
          labelname = "Image"
          name = "productImg"
          setInput = {setInput}
          input = {input}
          onChange = {handlePreviewImg}
        />
        <div>
          <img
            src = {input.imagePath}
            className='preview-img'
          />
        </div>
        <button type='submit' className='form-controls btn btn-primary'>Submit</button>
      </form>
    </div>
  )
  }

Мой компонент Input.js:

const Input = ({ setInput, input, labelname, name, inputType, onChange=null}) => {
    const [value, setValue] = useState('');

    const onChangeHanlder = (e) => {
        setInput({...input, [name]: e.target.value})
    }
    var id = {name};
    return (
        <Fragment>
            <label htmlFor = {id} className='font-semibold text-white'>
                {labelname}:&nbsp;
            </label>
            <input
                id = {id}
                type = {inputType}
                name = {name}
                className='rounded input_form form-control mt-2 w-100'
                // placeholder = {placeholder} 
                onChange = {onChange ? onChange : onChangeHanlder}
            />
        </Fragment>
    )
}

Моя функция API:

        [HttpPost]
        public async Task<IActionResult> Create([FromBody] CreateProductRequestDTO requestDTO)
        {
            if (!ModelState.IsValid) 
            {
                return BadRequest(ModelState);
            }
            var productModel = requestDTO.ToProductsFromCreateDTO();
            await _productRepo.CreateAsync(productModel);
            return CreatedAtAction(nameof(GetById), new {id = productModel.Id}, productModel.ToProductDTO());
        }

И главный герой, DTO, о котором я упоминал выше. Я действительно думал, что это будет последнее место, где может произойти ошибка, потому что я буквально копирую атрибут «name» из файла ReactJs, упомянутого выше, и создаю этот DTO (Решение (1)). Но это не сработало. Поэтому я вставляю атрибуты из класса Products, но, как я уже сказал, этот метод делает полученные данные пустыми (Решение (2))

    public class CreateProductRequestDTO
    {
        //Solution (1)
        // public string? ProductName {get; set; } = string.Empty;
        // public int ProductPrice {get; set; } 
        // public bool ProductStatus {get; set; }
        // public string? ProductDescription {get; set; } = string.Empty;

        //Solution (2)
        public string Name {get; set; } = string.Empty;
        public int Price {get; set; } 
        public bool Status {get; set; }
        public string Description {get; set; } = string.Empty;
    }

И если вам это нужно, объект «вход» будет выглядеть точно так же, как «initialFieldValues». Может кто-нибудь объяснить мне, что происходит? Редактировать: Это данные запроса:

И это ответ от ASP.NET. Как видите, он возвращает нулевое и пустое значение. (Пожалуйста, игнорируйте код состояния 201):