Question

我要在调度后在public function tambahProduk(){ $foto_produk = ''; if($_FILES['foto_produk']['name'] != ''){ $foto_produk = $_FILES['foto_produk']['name']; $foto_produk_baru = uniqid(); $foto_produk_baru .= '.'.end(explode('.',$foto_produk)); $foto_produk = $foto_produk_baru; } $this->db->query('INSERT INTO '.$this->table.' VALUES("", :nama_produk, :harga_produk, :berat, :foto_produk, :deskripsi_produk, :id_kategori, :stok)'); $this->db->bind('nama_produk', $_POST['nama_produk']); $this->db->bind('harga_produk', $_POST['harga_produk']); $this->db->bind('berat', $_POST['berat']); $this->db->bind('foto_produk', $foto_produk); $this->db->bind('deskripsi_produk', $_POST['deskripsi_produk']); $this->db->bind('id_kategori', $_POST['id_kategori']); $this->db->bind('stok', $_POST['stok']); $this->db->execute(); $stts = $this->db->rowCount(); if($stts > 0){ if($_FILES['foto_produk']['name'] != ''){ move_uploaded_file($_FILES['foto_produk']['tmp_name'], './assets/img/produk/'.$foto_produk); } $response = [ 'status' => 'success', 'pesan' => 'Data produk berhasil ditambahkan' ]; }else{ $response = [ 'status' => 'error', 'pesan' => 'Data produk gagal ditambahkan' ]; } return $response; }端调度动作，我想从redux状态获取状态并将其传递给组件内部的本地状态，但是问题是无论何时我尝试执行此操作，它要么进入无限循环，要么根本没有setState。我不知道该怎么解决。任何帮助都会很棒。

这是我的代码。

useEffect

当我在useEffect中添加可选的第二个参数，例如const [tableData, setTableData] = React.useState([]); const DataReceived = (state) => <--- Here I am getting state from store. state.AllUsers.Seller.sellerDetails.data._embedded; const selectedData = useSelector(DataReceived, shallowEqual); const selectedDataAgain = selectedData ? selectedData.vendorUserResourceList : null; console.log("selectedDataAgain", selectedDataAgain); <--- this one is working this shows array of data. console.log("selectedDataAgainTable", tableData); const { GetUserLoadVendors } = props; React.useEffect(() => { const access_token = localStorage.getItem("access_token"); GetUserLoadVendors(access_token); <--- this is the actions setTableData(selectedDataAgain); <--- here am trying to set State }, []);时，它将进入无限循环。如果我不添加任何依赖项，则不会设置状态。

Answer 1

将selectedDataAgain带入useEffect并包括selectedData作为依赖项

const [tableData, setTableData] = React.useState([]);



 const DataReceived = (state) =>                              <--- Here I am getting state from store.
    state.AllUsers.Seller.sellerDetails.data._embedded;
  const selectedData = useSelector(DataReceived, shallowEqual);
 
  console.log("selectedDataAgainTable", tableData);

  const { GetUserLoadVendors } = props;

  React.useEffect(() => {
   const selectedDataAgain = selectedData
    ? selectedData.vendorUserResourceList
    : null;

  console.log("selectedDataAgain", selectedDataAgain);    // this one is working this shows array of data.
    const access_token = localStorage.getItem("access_token");
    GetUserLoadVendors(access_token);          <--- this is the actions
    setTableData(selectedDataAgain);           <--- here am trying to set State
  }, [selectedData]);

我不认为您希望useEffect在GetUserLoadVendors更改时触发，如果愿意，可以包含GetUserLoadVendors sa依赖项，但请确保将其与useCallback包装在一起创建位置（父组件）。

Answer 2

理想情况下，不需要从props复制数据到状态，因为它可以直接从redux状态导出。

但是，如果需要，您应该在单独的useEffect中编写更新逻辑，例如

const [tableData, setTableData] = React.useState([]);

const DataReceived = (state) =>                     
    state.AllUsers.Seller.sellerDetails.data._embedded;
const selectedData = useSelector(DataReceived, shallowEqual);
const selectedDataAgain = selectedData
    ? selectedData.vendorUserResourceList
    : null;

  console.log("selectedDataAgain", selectedDataAgain);  
  console.log("selectedDataAgainTable", tableData);

  const { GetUserLoadVendors } = props;

  React.useEffect(() => {
    const access_token = localStorage.getItem("access_token");
    GetUserLoadVendors(access_token);
  }, []);

  React.useEffect(() => {
      setTableData(selectedDataAgain);

  }, [selectedData]) // Dependency is selectedData and not selectedDataAgain since reference of selectedDataAgain changes on every render whereas it doesn't for selectedData

如何阻止useEffect进入useEffect内的无限循环或setState

2 个答案: