Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Uncaught TypeError: this.state.categorias.map is not a function

Foto do erro: https://prnt.sc/CJw35qiINTSk

FormularioCadastro.jsx

import React, { Component } from "react";
import "./estilo.css";

class FormularioCadastro extends Component {

  constructor(props) {
    super(props);
    this.titulo = '';
    this.texto = '';
    this.categoria = 'Sem Categoria';
    this.state = {
      categorias: []
    }
  }

  componentDidMount() {
    this.props.categorias.inscrever(this._novasCategorias(this))
  }

  _novasCategorias(categorias) {
    this.setState({...this.state, categorias})
  }

  _handleMudancaTitulo(evento) {
    evento.stopPropagation();
    this.titulo = evento.target.value;
  }

  _handleMudancaTexto(evento) {
    evento.stopPropagation();
    this.texto = evento.target.value;
  }

  _handleMudancaCategoria(evento) {
    evento.stopPropagation();
    this.categoria = evento.target.value;
  }

  _criarNota(evento) {
    evento.preventDefault();
    evento.stopPropagation();
    this.props.criarNota(this.titulo, this.texto, this.categoria);
    document.querySelectorAll(".form-cadastro_input")[1].value = '';
    document.querySelectorAll(".form-cadastro_input")[2].value = '';
  }

  render() {
    return (
      <form className="form-cadastro "
        onSubmit={this._criarNota.bind(this)}
      >
        <select onChange={this._handleMudancaCategoria.bind(this)} className="form-cadastro_input">
          <option key={"Sem Categoria"}>Sem Categoria</option>

          {this.state.categorias.map(categoria => {
            return <option key={categoria}>{categoria}</option>
          })}
        </select>
        <input
          type="text"
          placeholder="Título"
          className="form-cadastro_input"
          onChange={this._handleMudancaTitulo.bind(this)}
        />
        <textarea
          rows={15}
          placeholder="Escreva sua nota..."
          className="form-cadastro_input"
          onChange={this._handleMudancaTexto.bind(this)}
        />
        <button className="form-cadastro_input form-cadastro_submit">
          Criar Nota
        </button>
      </form>
    );
  }
}

export default FormularioCadastro;
1 resposta
solução!

Achei o erro:

Antes

componentDidMount() {
    this.props.categorias.inscrever(this._novasCategorias(this))
  }

Depois

componentDidMount() {
    this.props.categorias.inscrever(this._novasCategorias.bind(this))
  }

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software