相关疑难解决方法(0)

为什么调用react setState方法不会立即改变状态?

我正在阅读文档的Forms部分,并尝试使用此代码来演示用法(JSBIN).onChange

var React= require('react');

var ControlledForm= React.createClass({
    getInitialState: function() {
        return {
            value: "initial value"
        };
    },

    handleChange: function(event) {
        console.log(this.state.value);
        this.setState({value: event.target.value});
        console.log(this.state.value);

    },

    render: function() {
        return (
            <input type="text" value={this.state.value} onChange={this.handleChange}/>
        );
    }
});

React.render(
    <ControlledForm/>,
  document.getElementById('mount')
);
Run Code Online (Sandbox Code Playgroud)

当我<input/>在浏览器中更新值时,回调console.log内的第二个handleChange打印与value第一个相同console.log,为什么我看不到回调this.setState({value: event.target.value})范围内的结果handleChange

javascript reactjs react-jsx

286
推荐指数
5
解决办法
15万
查看次数

useState设置方法不能立即反映更改

我正在尝试学习钩子,而useState方法使我感到困惑。我正在将初始值分配给数组形式的状态。即使使用spread(...)或,useState中的set方法对我也不起作用without spread operator。我在另一台PC上制作了一个API,我正在调用它并提取要设置为状态的数据。

这是我的代码:

import React, { useState, useEffect } from "react";
import ReactDOM from "react-dom";

const StateSelector = () => {
  const initialValue = [
    {
      category: "",
      photo: "",
      description: "",
      id: 0,
      name: "",
      rating: 0
    }
  ];

  const [movies, setMovies] = useState(initialValue);

  useEffect(() => {
    (async function() {
      try {
        //const response = await fetch(
        //`http://192.168.1.164:5000/movies/display`
        //);
        //const json = await response.json();
        //const result = json.data.result;
        const result = [
          {
            category: …
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-hooks

46
推荐指数
9
解决办法
2万
查看次数

标签 统计

javascript ×2

reactjs ×2

react-hooks ×1

react-jsx ×1