Question

我正在使用带有简单react应用程序的awesome-debounce-promise来延迟函数执行，这会触发操作以更新数据库中的标头。我也使用redux-saga和axios，使用const的官方示例不起作用，因为我在axios中创建了api调用... onChange操作，我将此函数称为...

    changeCity = (e) => {
    let storedHeader = JSON.parse(localStorage.getItem('offer_header'))
      if(storedHeader !== null) {
        let updatedHeader = {
            id : storedHeader.id,
            customer : storedHeader === null ? this.state.customer : storedHeader.customer,
            address : storedHeader === null ? this.state.address : storedHeader.address,
            city : e.target.value,
            date : storedHeader === null ? moment(this.state.date).format("YYYY-MM-DD 00:00:00") : moment(storedHeader.date).format("YYYY-MM-DD 00:00:00"),
            price : parseFloat(localStorage.getItem('offer_header_price')),
            tax : parseFloat(localStorage.getItem('offer_header_price')) * 0.21,
            total : parseFloat(localStorage.getItem('offer_header_price')),
        }
        const result = AwesomeDebouncePromise(this.props.editHeaderDB(updatedHeader), 2000);
        console.log('result = ', result);
    }
    this.setState({
        city: e.target.value
    })
}

api.js的代码段

export function editOfferHeader_api(header) {
   return axios.put(apiUrl + '/offerHeader/' + header.id ,header)
}

而saga.js是

export function* editOfferHeaderDB(action) {
const response = yield call(editOfferHeader_api, action.payload)
if(!response && (!response.data || !response.message)) {
    return yield put(editOfferHeaderDB_failure('Internal server error editing offer header'))
}
if(response.status === 200) {
    localStorage.setItem('offer_header', JSON.stringify(response.data))
    return yield put(editOfferHeaderDB_success(response.data))
} else {
    return yield put(editOfferHeaderDB_failure('Error editing offer header'))
}

}

有人可以帮助我，如何解决此问题？

Answer 1

您必须确保使用相同去抖动功能，并且不要每次都回想起AwesomeDebouncePromise。

因为每次调用都会创建一个新函数，所以它将失去去抖动的目的。

因此，您必须首先（最好在顶层）创建去抖动功能，然后在整个代码中重复使用它。

（编辑：示例）

export const editOfferHeader_api = AwesomeDebouncePromise(
  function (header) {
    return axios.put(apiUrl + '/offerHeader/' + header.id ,header)
  },
  2000,
)

很棒的防抖承诺不能与调用函数一起使用吗？

1 个答案: