Dá o erro quando clico pra apagar a nota.

Oi Leonardo!

Isso está acontecendo porque o que você passou para o apagarNota não é uma função.

Por favor, confira se no App.js, o componente ListaDeNotas está recebendo como parâmetro a função deletarNota, da seguinte forma:

 deletarNota(index){
    let arrayNotas = this.state.notas;
    arrayNotas.splice(index,1);
    this.setState({notas:arrayNotas})
  }

  render() {
    return (
      <section className="conteudo">
        <FormularioCadastro criarNota={this.criarNota.bind(this)}/>
        <ListaDeNotas 
        apagarNota={this.deletarNota.bind(this)} // passando a função como parâmetro
        notas={this.state.notas}/>
      </section>
    );
  }

Espero ter ajudado! Se ainda tiver alguma dúvida, pode postar aqui!

Olá, Leonardo, tudo bem?

A sua variável apagarNota provavelmente está definida como undefined! Provavelmente a propriedade apagarNota não foi a propriedade que você passou desde o componente ListaDeNotas até o componente CardNota.

Veja que em App.js, o intrutor passa o método deletarNota da seguinte forma para o componente ListaDeNotas:

          <ListaDeNotas
            notas={this.state.notas}
            apagarNota={this.deletarNota.bind(this)}
          />

Ou seja, ele está acessando o método deletarNota e passando como uma propriedade chamada apagarNota, que poderá ser usada dentro do componente ListaDeNotas. Então se você quiser acessar essa função lá dentro de ListaDeNotas, você escreverá this.props.apagarNota.

Por outro lado, digamos que você tenha passado a função da seguinte forma:

          <ListaDeNotas
            notas={this.state.notas}
            deletarNota={this.deletarNota.bind(this)} // O nome da propriedade agora é "deletarNota" em vez de "apagarNota"
          />

O nome da propriedade que recebe a função agora se chama deletarNota, e para acessá-la dentro de ListaDeNotas, você deve utilizar this.props.deletarNota.

Se você não acessar com o mesmo nome da propriedade, você acabará acessando algo que não existe e estará na verdade utilizando um valor undefined. Então, lá em CardNota, ao tentar executar a suposta função, o programa indicará que na verdade não é uma função, porque você estará lidando com um valor undefined.

Veja se você manteve o fluxo correto desde App.js até ListaDeNotas! Se o erro persistir, você pode mandar aqui os códigos dos seus componentes para que possamos te auxiliar.

Fico no aguardo!

Olá Eduardo, agradeço a colaboração.

Após a postagem continuei procurando e percebi que no método de renderização da ListaDeNotas.jsx a associação da props estava errada:

Como estava:apagarNota={this.props.apagarNotas}

Corrigido: apagarNota={this.props.apagarNota}// tirei o "s".

Funcionou.

Foi bom, pois precisei observar e entender melhor o caminho que estava sendo feito.

Agradeço novamente a disposição. Leonardo M.