Question

我将debounce library properli导入react + typescript项目时遇到问题。

我做了：

npm install debounce --save
typings install dt~debounce --save --global
在我的文件中，导入debounce为：import debounce from 'debounce';
使用debounce，如：debounce(function(){ console.log('testtt'); })();

使用这些代码我的代码编译正在通过，但是当我尝试运行webside时，我得到错误：

Uncaught TypeError: debounce_1.default is not a function

我做错了什么？

由于

Answer 1

我发现lodash库具有debounce函数和打字稿的类型。

它的工作原理如下：

import _ = require('lodash');

...

class SearchControl extends React.Component<ISearchControlProps, ISearchControlState> {
    private debouncedLoadSuggestions;
    constructor(props: any) {
        ...
        this.debouncedLoadSuggestions = _.debounce(this.fetchSuggestions, 500);
    }

    fetchSuggestions = (value: string) => {
        ...
    };

    onSuggestionsFetchRequested = ({value}) => {
        this.debouncedLoadSuggestions(value);
    };
}

Answer 2

我也遇到了这个问题。似乎debounce的类型是错误的，可能是对于过时的非模块版本的库。我并不倾向于仅为此功能引入所有lodash，因此对于将来的任何人来说，这些类型都适用于我：

declare module "debounce" {
  function debounce<F extends Function>(func: F, wait?: number, immediate?: boolean): F;
  namespace debounce {}
  export = debounce;
}

示例：

import * as debounce from "debounce";

document.body.addEventListener("mousemove", debounce((e: MouseEvent) => console.log("moved"), 500));

reactJs +打字稿+去抖 - 无法正确导入去抖动

2 个答案: