可能未處理的承諾拒絕未定義不是函數

Question

我正在使用 React Native。 我已經查看過什么是未處理的承諾拒絕？ ，但我完全看不懂。

當我創建一個組件時：

render(){
    const MenuComponent = (
      <MenuScreen CloseSlideMenu={this.SlideMenu.CloseSlideMenu} />
    )
    ...
}

我收到以下錯誤：

'可能未處理的承諾拒絕（ID：0）類型錯誤：未定義不是函數（評估'_this.OpenSlideMenu.bind（true）。then（function（）{}））'

this.OpenSlideMenu()在聲明constructor()

constructor (props, context) {
  super(props, context)

  this.OpenSlideMenu = this.OpenSlideMenu.bind(true).catch(function(e){
    console.log("Promise Rejected");
  });
  this.CloseSlideMenu = this.CloseSlideMenu.bind(true).catch(function(e){
    console.log("Promise Rejected");
  });
}

this.drawer 在 render() 方法中聲明：

render () {
  const MenuComponent = (
    <MenuScreen CloseSlideMenu={this.SlideMenu.CloseSlideMenu} />
  )

  return (
    <Drawer
      ref={(ref) => this.drawer = ref}
      content={MenuComponent}
      tapToClose={true}
      openDrawerOffset={170}
      stles={drawerStyles}
      panCloseMask={0.2}
      closedDrawerOffset={-3}
      styles={drawerStyles}
      tweenHandler={(ratio) => ({
        main: { opacity: (2-ratio)/2 }
      })}>
      <GroceryScreen selectedCategory='Todos' OpenSlideMenu={this.OpenSlideMenu} />
    </Drawer>
  )
}

有人可以向我解釋為什么我有這個錯誤嗎？ 我該如何解決？

Answer 1

夫婦的事情錯了。 您正在使用.bind(true)將布爾值綁定為函數的this上下文。

您還在函數聲明中使用了.catch() 。 .catch() .then()和.catch()用於函數調用。

此外，如果這是函數的初始聲明，則您正在嘗試在聲明之前對其進行.bind() 。 您需要先聲明它。

我建議你在 MDN 上閱讀.bind()和Promise 。

這里有一個小例子，希望能幫助你理解這些原則：

class Demo extends PureComponent {
    constructor( props ) {
        // allow the user this in constructor
        super( props );

        // set default state
        this.state = {
            text: "Awaiting data..."
        }

        // only needed if used in a callback
        this.method = this.method.bind( this );
    }

    componentDidMount() {
        // calling the method that returns a promise when component mounts
        this.method()
            .then((res) =>{
                // set state in a non-mutating way
                this.setState({text: res});
            });
    }

    // declaring a method to handle the api call
    // yours will not be named method
    method() {
        return new Promise(
            (resolve, reject) => {
                // simulating network delay of 2 seconds ( lets hope not! )
                setTimeout(() => {
                    resolve( "Data returned from promise" );
                }, 2000 );
            });
        );
    }

    render() {
        // destructure the text var from data
        const { text } = this.state;
        // return text
        return (
            <p>{ text }</p>
        );
    }
};

Answer 2

由於不同的原因，我遇到了類似的錯誤：使用 useContext 從上下文文件中導入 aync 函數“myFunc”

我的錯誤：未處理的承諾拒絕不是一個函數是一個承諾的實例

const {
    state: { some, stuff }, myFunc,
} = useContext(SomeContext);

調用沒有參數/變量的 myFunc 時不包括括號。 更改const output = await myFunc(); const output = await myFunc; 為我修好了。