onClick请勿调用该函数-电脑我帮您

onClick请勿调用该函数

我想在onclick事件调用该函数时更改div，但它不起作用。我想要这样，当我单击按钮时，它将调用函数botaoContinuar（）。函数botaoContinuar（）应该调用另一个函数（finalizarOuNao（））。函数finalizarOuNao（）应该显示/调用函数-continuar（）-。所有这些工作将在函数continuar（）中显示div。但这不起作用，喜欢React的人可以帮助我吗？谢谢

import React from 'react';
import logo from './logo.svg';
import './App.css';
import PropTypes from 'prop-types';
import styled from "styled-components";


function finalizarOuNao (props) {
  if (props.finalizarET1) {
    return (<continuar/>)
  }
}

function continuar (props) {
  return (
    <div>
      <p> Por que você não terminou um curso de graduação?</p>
         <input type="text"/>
         <p> Você fez algum curso complementar? </p>
      <select>
        <option>Curso Técnico</option>
        <option>Curso de Inglês</option>
        <option>Não fiz curso complementar</option>
      </select>
      <button>Finalizar</button>
  </div>
  )
}

function finalizar (props) {
  return (
    <div>
      <h1>O FORMULÁRIO ACABOU</h1>
      <h2>Muito obrigado por particiupar! Entraremos em contato!</h2>
    </div>
  )

}

class App extends React.Component{
    constructor(props){
        super(props);
        this.state = {
         escolhasDeEscolaridade : "Ensino Médio Completo",    
         finalizarET1 :false,       
    }
  }

    escolhasDeEscolaridade= (event) => {
      this.setState({ escolhasDeEscolaridade: event.target.value });
      console.log ("oi,testando")
    }

    botaoContinuar = () => {
      function continuar() {
        return (
          <div>
            <p> Por que você não terminou um curso de graduação?</p>
               <input type="text"/>
               <p> Você fez algum curso complementar? </p>
            <select>
              <option>Curso Técnico</option>
              <option>Curso de Inglês</option>
              <option>Não fiz curso complementar</option>
            </select>
            <button>Finalizar</button>
        </div>
        )
      } 
      console.log ("me chamaram")
    }

    botaoFinalizar = ()=> {
    this.setState({finalizarET1 : !this.stste.finalizarET1})
    }

    render() {
      let escolha;     
      return (

        <div>
          <div>
            <p> Qual seu nome?</p>
            <input type="text"/>
            <p> Qual sua idade?</p>
            <input type="text"/>
            <p> Qual seu email?</p>
            <input type="text"/>
            <p> Qual sua escolaridade?</p>
            <select value={this.state.value} onChange={this.escolhasDeEscolaridade}>
              <option id=" EMC" value="Ensino Médio Completo">Ensino Médio Completo</option>
              <option id=" EMI" value="Ensino Médio Incompleto">Ensino Médio Incompleto</option>
              <option id=" ESC" value="Ensino Superior Completo">Ensino Superio Completo</option>
              <option id=" ESI" value="Ensino Superior Incompleto">Ensino Superior Incompleto</option>
            </select>
            <botaoContinuar finalizarET1={this.state.finalizarET1} />
            <button onClick = {this.botaoContinuar} >continuar</button>
          </div>
        {escolha}
        </div>
      );
    }


}
    //<finalizarOuNao finalizarET1={this.state.finalizarET1} />

export default App;

回答如下：

您在函数内部具有函数，而不是调用它。

botaoContinuar = () => {
      function continuar() {

您所描述的，您可以这样称呼：

botaoContinuar = () => {
  function continuar() {
  }
  this.finalizarOuNao()
  continuar()
}

onClick请勿调用该函数

import React from 'react';
import logo from './logo.svg';
import './App.css';
import PropTypes from 'prop-types';
import styled from "styled-components";


function finalizarOuNao (props) {
  if (props.finalizarET1) {
    return (<continuar/>)
  }
}

function continuar (props) {
  return (
    <div>
      <p> Por que você não terminou um curso de graduação?</p>
         <input type="text"/>
         <p> Você fez algum curso complementar? </p>
      <select>
        <option>Curso Técnico</option>
        <option>Curso de Inglês</option>
        <option>Não fiz curso complementar</option>
      </select>
      <button>Finalizar</button>
  </div>
  )
}

function finalizar (props) {
  return (
    <div>
      <h1>O FORMULÁRIO ACABOU</h1>
      <h2>Muito obrigado por particiupar! Entraremos em contato!</h2>
    </div>
  )

}

class App extends React.Component{
    constructor(props){
        super(props);
        this.state = {
         escolhasDeEscolaridade : "Ensino Médio Completo",    
         finalizarET1 :false,       
    }
  }

    escolhasDeEscolaridade= (event) => {
      this.setState({ escolhasDeEscolaridade: event.target.value });
      console.log ("oi,testando")
    }

    botaoContinuar = () => {
      function continuar() {
        return (
          <div>
            <p> Por que você não terminou um curso de graduação?</p>
               <input type="text"/>
               <p> Você fez algum curso complementar? </p>
            <select>
              <option>Curso Técnico</option>
              <option>Curso de Inglês</option>
              <option>Não fiz curso complementar</option>
            </select>
            <button>Finalizar</button>
        </div>
        )
      } 
      console.log ("me chamaram")
    }

    botaoFinalizar = ()=> {
    this.setState({finalizarET1 : !this.stste.finalizarET1})
    }

    render() {
      let escolha;     
      return (

        <div>
          <div>
            <p> Qual seu nome?</p>
            <input type="text"/>
            <p> Qual sua idade?</p>
            <input type="text"/>
            <p> Qual seu email?</p>
            <input type="text"/>
            <p> Qual sua escolaridade?</p>
            <select value={this.state.value} onChange={this.escolhasDeEscolaridade}>
              <option id=" EMC" value="Ensino Médio Completo">Ensino Médio Completo</option>
              <option id=" EMI" value="Ensino Médio Incompleto">Ensino Médio Incompleto</option>
              <option id=" ESC" value="Ensino Superior Completo">Ensino Superio Completo</option>
              <option id=" ESI" value="Ensino Superior Incompleto">Ensino Superior Incompleto</option>
            </select>
            <botaoContinuar finalizarET1={this.state.finalizarET1} />
            <button onClick = {this.botaoContinuar} >continuar</button>
          </div>
        {escolha}
        </div>
      );
    }


}
    //<finalizarOuNao finalizarET1={this.state.finalizarET1} />

export default App;

回答如下：

您在函数内部具有函数，而不是调用它。

botaoContinuar = () => {
      function continuar() {

您所描述的，您可以这样称呼：

botaoContinuar = () => {
  function continuar() {
  }
  this.finalizarOuNao()
  continuar()
}

电脑我帮您（www.dn580.com）

onClick请勿调用该函数

onClick请勿调用该函数

onClick请勿调用该函数

与本文相关的文章

评论列表 (0)