Question

我有一个选择表行的函数，该函数在下面，它在我的SupplierSearchComponent组件之内

   const handleAddressCheck = item => {
    const itemIndex = supplierAddress.findIndex(supplierItem => supplierItem.id === item.id);
    let newAddresses;
    if (itemIndex >= 0) {
        //the reasoning behind using a filter is that splice will not return an updated array, filter however does
        newAddresses = supplierAddress.filter(x => x.id !== item.id);
    } else {
        newAddresses = [...supplierAddress, item];
    }
    setSupplierAddress(newAddresses);
    props.onSelectAddress(newAddresses);

    console.log('this is the item => ', newAddresses);
};

但是我也将此功能作为

传递给另一个组件

  const onSelectedAddressesChange = (addresses) => {
    props.setFieldValue('supplierAddresses', addresses);
};

然后我将此值传递给另一个组件

     <SearchSuppliers
       name="supplierSearch"
       label="Supplier Search"
       id="supplierSearch"
       onSelectAddress={onSelectedAddressesChange}
                        />

然后从搜索供应商那里我将道具传递到

的原始组件中

<SupplierSearchComponent
            onSelectAddress={props.onSelectAddress}
        />

现在终于可以在我的SupplierSearchComponent中使用

  <SupplierContactDetails
     onSelectAddress{props.onSelectAddress}
                            />

但是，在我的ContactDetails中，我实际上无法console.log（onSelectAddress），因为它将导致未定义，我如何才能成功地传递此函数，或者更确切地说，其结果呢？

Answer 1

我想您在最后一个组件“ SupplierContactDetails”传递道具时跳过了“ =”。

通过道具传递功能

1 个答案: