javascript - TypeError: (intermediate value).then is not a function - Stack Overflow

admin管理员组

文章数量:1335624

i use react 16, babel 7, webpack 4.

another project is working, but this project is not working. error is (intermediate value).then is not a function . i don't know what is problem... umm.. how to solve this problem? please help me.

import React, { Component } from 'react';
// import throttle from 'lodash.throttle'
import debounce from 'lodash.debounce';


class Promise extends Component {
    constructor() {
        super();
        // this.handleDebounce = this.handleDebounce.bind(this);
    }
    handleDebounce = (e) => {
        // debounce(this.handleStart, 100); // 이런식으로 쓰면 안된다!! SyntheticEvent pooling (이벤트 풀링)  참고 .html#event-pooling
        // 콜백함수는 해당 이벤트가 실행되는 동안에만 유효함
        this.setSearchTerm(e.target.value);
    }

    setSearchTerm = debounce((searchTerm) => this.handleStart(searchTerm), 2000);

    handleStart = (value) => {
        console.log("start", value)
        this.handlePromise1(value)
            .then(text => {
                console.log(text)
            })
            .catch((err) => {console.log("err", err)})
    }

    handlePromise1 = (value) => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                this.handlePromise2(resolve(value));
            }, 300);
        });
    }

    handlePromise2 = (value) => {
        return new Promise((resolve, reject) => {
            resolve(value);
        });
    }

    render() {
        return (
            <div>
                <input onKeyUp={this.handleDebounce}></input>
            </div>
        );
    }
}



export default Promise;

i use react 16, babel 7, webpack 4.

another project is working, but this project is not working. error is (intermediate value).then is not a function . i don't know what is problem... umm.. how to solve this problem? please help me.

import React, { Component } from 'react';
// import throttle from 'lodash.throttle'
import debounce from 'lodash.debounce';


class Promise extends Component {
    constructor() {
        super();
        // this.handleDebounce = this.handleDebounce.bind(this);
    }
    handleDebounce = (e) => {
        // debounce(this.handleStart, 100); // 이런식으로 쓰면 안된다!! SyntheticEvent pooling (이벤트 풀링)  참고 https://reactjs/docs/events.html#event-pooling
        // 콜백함수는 해당 이벤트가 실행되는 동안에만 유효함
        this.setSearchTerm(e.target.value);
    }

    setSearchTerm = debounce((searchTerm) => this.handleStart(searchTerm), 2000);

    handleStart = (value) => {
        console.log("start", value)
        this.handlePromise1(value)
            .then(text => {
                console.log(text)
            })
            .catch((err) => {console.log("err", err)})
    }

    handlePromise1 = (value) => {
        return new Promise((resolve, reject) => {
            setTimeout(() => {
                this.handlePromise2(resolve(value));
            }, 300);
        });
    }

    handlePromise2 = (value) => {
        return new Promise((resolve, reject) => {
            resolve(value);
        });
    }

    render() {
        return (
            <div>
                <input onKeyUp={this.handleDebounce}></input>
            </div>
        );
    }
}



export default Promise;

• javascript
• reactjs
• promise

Share Improve this question Follow asked Nov 19, 2018 at 2:06 kekeeekekeee 47522 gold badges77 silver badges1414 bronze badges 2

• 1 class Promise extends Component ... are you sure you want to override Promise? return new Promise ... will return a new instance of your class Promise - which has no .then method – Bravo Commented Nov 19, 2018 at 2:14
• oh my god..... thank you... – kekeee Commented Nov 19, 2018 at 5:11

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 3

Solution: (edit 1)

The issue was not because of async but because of overriding Promise on browser. The new Promise() doesn't actually create the expected promise. Check here

No async Needed as I mentioned before this edit as below:

Stale answer (not right): just for reference: I think that issue was a missing async during declaration of handlePromise1. Because it signifies that the function is asynchronous and may return a Promise as a return value. if not specified it would treat it as any object and .then might not be available.

I just added async and found it to be working in this code

Also,the ment by @bravo is valid. You should not try to override Promise in any JS code

本文标签： javascriptTypeError (intermediate value)then is not a functionStack Overflow