Javascript 设置函数的状态形式返回值

我想用

allTimeInSeconds

的值设置

timeToCountdown

的状态

然后我想把数据作为道具发送到组件

class Timer extends Component {
    constructor(props){
        super(props); 

        this.state = {
            hours: "",
            minutes: "",
            seconds: "",
            timeToCountdown: ""   
        };

        this.grabHours = this.grabHours.bind(this);
        this.grabMinutes = this.grabMinutes.bind(this);
        this.grabSeconds = this.grabSeconds.bind(this);
        this.changeAllTimeInputsToSeconds = this.changeAllTimeInputsToSeconds.bind(this);
    }

   changeAllTimeInputsToSeconds(){
        var timerHours = Number((parseInt(this.hours.value, 10)*3600)) || 0
        var timerMinutes = Number((parseInt(this.minutes.value, 10)*60)) || 0
        var timerSeconds = Number(parseInt(this.seconds.value, 10)) || 0

        var allTimeInSeconds = timerHours + timerMinutes + timerSeconds;       

        this.setState({timeToCountDownValue: this.allTimeInSeconds});

        console.log(allTimeInSeconds);

        return allTimeInSeconds;
    }

---

我想，如果我正确理解了这个问题，你可以这样做：

假设

timeToCountDown

是要作为属性发送的值，则不需要在函数

changeAllTimeInputsToSeconds

中返回该值。正如您已经做的那样，您可以使用

setState（）

函数来更新

状态

值。然后它会自动发送到您的组件

MyComponent

必须用您的组件替换，您要发送属性

class Timer extends Component {
    constructor(props){
        super(props); 

        this.state = {
            hours: "",
            minutes: "",
            seconds: "",
            timeToCountdown: 0,
        };

        this.grabHours = this.grabHours.bind(this);
        this.grabMinutes = this.grabMinutes.bind(this);
        this.grabSeconds = this.grabSeconds.bind(this);
        this.changeAllTimeInputsToSeconds();
    }

   changeAllTimeInputsToSeconds(){
        var timerHours = Number((parseInt(this.hours.value, 10)*3600)) || 0
        var timerMinutes = Number((parseInt(this.minutes.value, 10)*60)) || 0
        var timerSeconds = Number(parseInt(this.seconds.value, 10)) || 0
        var allTimeInSeconds = timerHours + timerMinutes + timerSeconds;       
        this.setState({timeToCountDown: allTimeInSeconds });
        console.log(allTimeInSeconds);
    }

    render() {
        return (
            <MyComponent timeToCountdown={this.state.timeToCountdown} />
        )
    }

类计时器扩展组件{
建造师（道具）{
超级（道具）；
此.state={
小时：“，
会议记录：“，
秒：“，
计数时间：0，
};
this.grabHours=this.grabHours.bind（this）；
this.grabMinutes=this.grabMinutes.bind（this）；
this.grabSeconds=this.grabSeconds.bind（this）；
这个.changeAllTimeInputsToSeconds（）；
}
changeAllTimeInputsToSeconds（）{
var timerHours=数字（（parseInt（this.hours.value，10）*3600））|0
var timerMinutes=Number（（parseInt（this.minutes.value，10）*60））| 0
var timerSeconds=Number（parseInt（this.seconds.value，10））| | 0
var ALLTIMENSEONDS=timerHours+timerMinutes+timerSeconds；
this.setState（{timeToCountDown:alltimeinsectonds}）；
console.log（allTimeInSeconds）；
}
render（）{
返回(
)
}

我想，如果我正确理解了问题，你可以这样做：

假设

timeToCountDown

是要作为属性发送的值，则不需要在函数

changeAllTimeInputsToSeconds

中返回该值。正如您所做的那样，您可以使用

setState（）

函数更新

状态

值。然后它将自动发送到组件

MyComponent

必须用您的组件替换，您要发送属性

class Timer extends Component {
    constructor(props){
        super(props); 

        this.state = {
            hours: "",
            minutes: "",
            seconds: "",
            timeToCountdown: 0,
        };

        this.grabHours = this.grabHours.bind(this);
        this.grabMinutes = this.grabMinutes.bind(this);
        this.grabSeconds = this.grabSeconds.bind(this);
        this.changeAllTimeInputsToSeconds();
    }

   changeAllTimeInputsToSeconds(){
        var timerHours = Number((parseInt(this.hours.value, 10)*3600)) || 0
        var timerMinutes = Number((parseInt(this.minutes.value, 10)*60)) || 0
        var timerSeconds = Number(parseInt(this.seconds.value, 10)) || 0
        var allTimeInSeconds = timerHours + timerMinutes + timerSeconds;       
        this.setState({timeToCountDown: allTimeInSeconds });
        console.log(allTimeInSeconds);
    }

    render() {
        return (
            <MyComponent timeToCountdown={this.state.timeToCountdown} />
        )
    }

类计时器扩展组件{
建造师（道具）{
超级（道具）；
此.state={
小时：“，
会议记录：“，
秒：“，
计数时间：0，
};
this.grabHours=this.grabHours.bind（this）；
this.grabMinutes=this.grabMinutes.bind（this）；
this.grabSeconds=this.grabSeconds.bind（this）；
这个.changeAllTimeInputsToSeconds（）；
}
changeAllTimeInputsToSeconds（）{
var timerHours=数字（（parseInt（this.hours.value，10）*3600））|0
var timerMinutes=Number（（parseInt（this.minutes.value，10）*60））| 0
var timerSeconds=Number（parseInt（this.seconds.value，10））| | 0
var ALLTIMENSEONDS=timerHours+timerMinutes+timerSeconds；
this.setState（{timeToCountDown:alltimeinsectonds}）；
console.log（allTimeInSeconds）；
}
render（）{
返回(
)
}

错误如下：

var allTimeInSeconds = timerHours + timerMinutes + timerSeconds;       
this.setState({ timeToCountDownValue: this.allTimeInSeconds });

变量

this.alltimeinsionds

不存在。我想这会起作用：

const allTimeInSeconds = timerHours + timerMinutes + timerSeconds;       
this.setState({ timeToCountDownValue: allTimeInSeconds });

错误如下：

var allTimeInSeconds = timerHours + timerMinutes + timerSeconds;       
this.setState({ timeToCountDownValue: this.allTimeInSeconds });

变量

this.alltimeinsionds

不存在。我想这会起作用：

const allTimeInSeconds = timerHours + timerMinutes + timerSeconds;       
this.setState({ timeToCountDownValue: allTimeInSeconds });

在当前代码中，即使在当前组件中，timeToCountdown的值也将为零

---

根据您当前的代码，即使在当前组件中，timeToCountdown的值也将为零，问题是？…问题不清楚？请理解我想用AllTimeInSeconds的值更新this.state.timeToCountdown。timeToCountdown的状态没有用allTimeToSeconds更新。我遵循了下面的回复中有说明，这就是我告诉你的结果。问题是？…问题不清楚？请理解我想用AllTimeInSeconds的值更新this.state.timeToCountdown。timeToCountdown的状态不是用allTimeToSeconds更新的。我按照下面回复中的说明进行了更新这就是我要告诉你的结果。当我调用子组件中的props时，它不会更新为allTimeInSeconds变量。它仍然保持为0。当我调用子组件中的props时，它不会更新为allTimeInSeconds变量。它仍然保持为0。