Question

我需要使用其他组件中的方法来获取数据，并且还需要使用同一按钮上的功能来清除其内容。也许有人有其他想法做同样的事情。

使用handleAddAsk函数获取所需的数据，此函数由ask__btn类按钮触发，但我也想在发送数据后使用此按钮上的handleClick函数清除输入


//I deleted redundant code

import React, { Component } from 'react';
import Ask from './Ask';
import './App.css';

class App extends Component {
  state = {
    asks: [],
  }

  handleAddAsk(index, name, data) {
    let asks = data[index].asks.push({
      id: data[index].asks.length,
      name: name,
    })
    this.setState({ asks });
  }

}

//second class

class Ask extends Component {
    state = {
        input: '',
    }

    handleChange = e => {
        const name = e.target.name
        const value = e.target.value
        this.setState({
            [name]: value,
        })
    }
    handleClick = () => {
        this.setState({
            input: '',
        })
    }
    render() {
        return (
            <div className="ask">
                <label className="ask__label">{this.props.name}
                    <input className="ask__input" name="input" value={this.state.input} onChange={this.handleChange} type="text" placeholder="treść pytania ..." />
                </label>
                <button className="ask__btn" onClick={this.props.handleAddAsk.bind(this, this.props.index, this.state.input, this.props.data)}>Dodaj pytanie</button>
            </div >
        );
    }

Answer 1

在Ask类中编写一个自定义事件处理函数，以调用handleClick和this.props.handleAddAsk，然后将该处理函数绑定到onClick事件。或在this.props.handleAddAsk中调用handleClick函数，并将handleClick分配给onClick事件。

我有两个组件，我想通过第一个组件中的功能将属性更改为第二个组件

1 个答案: