Javascript 为什么我的history.push在一个功能中起作用，而在另一个功能中起作用？

问题： 我一直在尝试使用props.history.push的编辑功能。我以前在我的add函数中使用过它，它很有效。我有相同的导入，唯一的主要区别是我还在编辑函数中使用useEffect，而在添加函数中我只有useState。还有，我需要在edit中访问每个id

错误： TypeError:无法读取未定义的属性“历史记录”

尝试： 我目前尝试使用重定向，它只是重定向而没有应用更改。使用history.push也可以在按钮onClick中工作，但不会应用我的更改。我经常看到的另一个解决方案是在导入useHistory（）之后让history=useHistory（），但这会给我一个钩子错误，我认为这可能是版本问题。然而，我的另一个主要问题是，为什么它对我的Add（）函数起作用

Add.js单击处理程序：

function handleSubmit(e) {
  e.preventDefault();
  axios({
    method: "post",
    url: "http://localhost:5000/add",
    data: body,
  })
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error);
    });
  console.log(state);
  props.history.push("/list");
}

function handleSubmit(e, props) {
  e.preventDefault();
  axios({
    method: "put",
    url: "http://localhost:5000/update-list/" + testid,
    data: body,
  })
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error);
    });
  console.log(state);
  props.history.push('/list');
}

function handleChange(e, field) {
  e.preventDefault();
  setState({
    ...state,
    [field]: e.target.value,
  });
}

这很好用

编辑：

function handleSubmit(e) {
  e.preventDefault();
  axios({
    method: "post",
    url: "http://localhost:5000/add",
    data: body,
  })
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error);
    });
  console.log(state);
  props.history.push("/list");
}

function handleSubmit(e, props) {
  e.preventDefault();
  axios({
    method: "put",
    url: "http://localhost:5000/update-list/" + testid,
    data: body,
  })
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error);
    });
  console.log(state);
  props.history.push('/list');
}

function handleChange(e, field) {
  e.preventDefault();
  setState({
    ...state,
    [field]: e.target.value,
  });
}

---

除了使用useEffect之外，代码的其余部分也几乎相同，因此我可以为字段提供默认值。这让我很困惑。任何帮助都将不胜感激。如果你需要更多的细节，请告诉我

尝试使用

window.history.push

而不是

history.push来使用该功能。如果函数的默认范围不是
窗口
，则必须在函数中手动指定
窗口
范围。从内联
script
标记调用外部脚本文件中的函数时，经常会出现此问题

更新：将您的
编辑
代码更改为

function handleSubmit(e, props) {
  e.preventDefault();
  axios({
    method: "put",
    url: "http://localhost:5000/update-list/" + testid,
    data: body,
  })
    .then(function (response) {
      console.log(response);
    })
    .catch(function (error) {
      console.log(error);
    });
  console.log(state);
  history.push('/list');
}

function handleChange(e, field) {
  e.preventDefault();
  setState({
    ...state,
    [field]: e.target.value,
  });
}

我在处理程序中传递道具，而不是编辑函数本身，这就是它不起作用的原因。因此，代码应该是：

function handleSubmit(e) {
    e.preventDefault();
    axios({
      method: "put",
      url: "http://localhost:5000/update-list/" + testid,
      data: body,
    })
      .then(function (response) {
        console.log(response);
      })
      .catch(function (error) {
        console.log(error);
      });
    console.log(state);
    props.history.push('/list');
  }

这解决了我的问题，现在它的工作！我很惊讶我之前没有注意到这一点，因为我花了很长时间才弄明白。
您好，谢谢您的建议！不幸的是，在这样做之后，他们两人都开始犯这样的错误，这仍然是历史。由于react路由器，添加功能和编辑功能都可以访问，所以一个正常工作，一个不正常工作，这让我很困惑（我已经用您的信息更新了我的答案。@llamingo可以吗？再次感谢您，但不幸的是它不起作用。我还尝试了windows.history.push（'/list'））但它告诉我它不是一个函数。你知道有没有任何潜在的原因，为什么它不能在函数中工作，而只能在点击按钮时工作？更新：我在错误的函数中传递道具，这就是为什么它不断中断的原因。非常感谢你的建议。也帮助我学习了新的东西！