エクスポートされた反応関数で "this"が定義されていません

Question

問題：エクスポートされた関数がReactコンポーネントによって呼び出されると、console.log(this)は未定義と表示されます。私はコンストラクタでそれをバインドして以来、コンポーネントを返すことを期待していました。

Leaderboard.js：

import React from 'react'; 
import {leaderboard, createLeaderboard} from '../utility/gamecode'; 

class Leaderboard extends React.Component{ 
    constructor(props){ 
    super(props); 
    this.showLeaderboard = showLeaderboard.bind(this); 
    this.state = { 
    } 
    }; 

    componentDidUpdate(){ 
    if(this.props.leaderboard){ 
     showLeaderboard(); 
    } 
    } 

    render(){ 
    return(
     <div className="leaderboard hidden"> 
     </div> 
    ) 
    } 

} 

export default Leaderboard; 

gamecode.js：

export function showLeaderboard(){ 
console.log(this); 
} 
//----------------------- 
export function createLeaderboard(props){ 
} 

Answer 1

あなたはshowLeaderboard代わりのthis.showLeaderboardを呼び出している - あなたがthisを結合した1つ。