JSFiddle - React, Tailwind, and code Playground

HTML

<input type="number" id="quantidade" value="0" />

<div id="campos">

</div>

CSS

#campos {
  margin-top: 30px;
  border-top: 1px solid;
  padding-top: 30px;
}
input {
  display: block;
  width: 100px;
  margin: 10px;
}

JavaScript

$(document).ready(function(){

	$('#quantidade').on('change', function(){

      var quantidade = $('#quantidade').val(),
          campos = $('#campos');

      campos.html(''); //aqui eu fiz limpar a div
      for (x = 0; x < quantidade; x++) {
        campos.append('<input type="text" id="campo-'+x+'" />');
      }

	});
  
});