Question

我是React / JS编程的新手。我无法解决我的代码问题。我有一个列，我想根据我的数组中的项目数添加行。但是，最后，只显示我表格的标题。

所以，我想知道我的错误是什么？我能够在日志中看到以下输出：

@Autowired
private ImportProdutoService importProdutoService;

/**
 * Cadastra um produto no sistema
 * @param cadastroProdutoDTO
 * @param result
 * @return
 * @throws DuplicateEntityException
 * @throws EntityValidationException
 */
@PostMapping
public ResponseEntity<Response<CadastroProdutoDTO>> cadastra(@Valid @RequestBody CadastroProdutoDTO cadastroProdutoDTO
        , BindingResult result) throws DuplicateEntityException, EntityValidationException {
    log.info("Cadastrando produto {}", cadastroProdutoDTO);
    Response<CadastroProdutoDTO> response = new Response<>();
    ImportProduto produto = cadastroProdutoDTO.getProduto();

    if(result.hasErrors()) {//ERROS DE VALIDAÇÃO RETORNA STATUS 400 E A LISTA DE ERROS.
        log.error("Erro dados de cadastro Produto: {}", result.getAllErrors());
        result.getAllErrors().forEach(error -> response.getErrors().add(error.getDefaultMessage()));
        return ResponseEntity.badRequest().body(response);
    }else {

        response.setData(cadastroProdutoDTO);

        ImportSku sku = new ImportSku(cadastroProdutoDTO.getCodigoDeBarras(), produto);

        produto = importProdutoService.cadastraProduto(produto, sku);
        response.getData().setProduto(produto);

        response.getData().setCodigoDeBarras(sku.getCodigoDeBarras());

        return ResponseEntity.ok(response);
    }
}

这是我的班级：

BodyComponent.jsx:55 1. Title One
BodyComponent.jsx:55 2. Title Two
BodyComponent.jsx:55 3. Title Three

Answer 1

rendering lists in ReactJS时：目标是return array components。

Array.prototype.map()通常用于Array.prototype.forEach()作为后者returns。

Array children在执行此操作时也需要唯一的key props。

请参阅下面的实例。

// Side Bar Panel.
const SideBarPanel = (itemList) => (
  <nav className="panel body-sidebar">
    <p className="panel-heading sidebar-title"> List of letters </p>
    {itemList.map((it, i) => <PanelItem key={i} id={it.id} title={it.title}/>}
  </nav>
)

// Panel Item.
const PanelItem = props => <a className="panel-block">{props.id}. {props.title}</a>

如何在JavaScript中显示表格中的项目列表？

1 个答案: