javascript - 如何正确改变状态? (只读错误)

标签 javascript reactjs

每次点击都会调用函数handleSubmit
在函数中我必须将页码增加 1。
但控制台错误 Uncaught Error: "page"is read-only
如何正确改变状态?

const Cards = () => {
  const [page, setPage] = useState(1);

  const handleSubmit = e => {
    e.preventDefault();
    setPage(page += 1);
    const axios = require('axios');
    const url = '/users'

    axios.get(url, {
      params: { page: page }
    }, {headers: {'Content-Type': 'text/javascript'}})
    .then(function (response) {

    })
    .catch(function (error) {
      console.log(error);
    })
    .then(function () {
      // always executed
    });
  };

  return (
    // ...
  )

};

export default Cards;

最佳答案

使用page + 1代替page += 1。您的状态应该是不可变的,因此在更新状态时切勿使用 = 运算符。每次执行此操作时,您都应该使用全新的值来更新它。这应该会在开发过程中为您节省大量时间。

关于javascript - 如何正确改变状态? (只读错误),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57252337/

相关文章:

javascript - 如何从 URL 中获取参数

javascript - TypeScript 枚举到对象数组

javascript - 带有动态左的GreenSock javascript动画

javascript - 在最多 X 个单词后拆分文本

reactjs - 我可以将react.js应用程序捆绑到多个模块中吗?

reactjs - 类型错误 : Cannot read property 'name' of undefined - react testing

javascript - 从另一个数组中存在的对象数组中删除对象

javascript - 创建选项卡,每个选项卡都有两个文本区域

javascript - React-Router 在按下后退按钮时跳过搜索查询

reactjs - React-router Link 组件防止子组件默认