bugfix> javascript > 投稿

似たような投稿がたくさんあることは知っていますが、どれも似たような投稿はないようです。

反応reduxを使用してmapStateToPropsを使用します。

私のApp.jsで使用しています import Score from './components/Score'; コンポーネントをインポートするため。

コンポーネントはScoreというフォルダーにあり、そこに含まれています index.js そして Score.js 。内部 Score.js 私は持っています:

const Score = ({team_score}) => ( 
    <>  
        <p>{ team_score }</p>
    </>
);
export default Score;

私の中に index.js 私は持っています:

import { connect } from "react-redux";
import Score from "./Score";
let mapStateToProps = (state) => {
    return {
        team_score: state.team_score,
    };
};
connect(mapStateToProps)(Score)

しかし、エラーが発生します:

./src/App.js
Attempted import error: './components/Score' does not contain a default export (imported as 'Score').

トリプルチェックを行いましたが、ファイルパスは正しいです。なぜこのエラーが発生するのかわかりません。

回答 2 件
  • 私はあなたの問題はあなたが持っていることだと思います index.js このフォルダ内のファイル。

    import Score from './components/Score'

    この行はから何かをインポートしようとします components/Score/index.js ファイルを作成し、そこから何もエクスポートしません。

    以下のようなことをする必要があります。

    import { connect } from "react-redux";
    import Score from "./Score";
    let mapStateToProps = (state) => {
        return {
            team_score: state.team_score,
        };
    };
    export default connect(mapStateToProps)(Score)
    
    

  • 2つの解決策:

    書き出す Score から index.js 内部のファイル Score フォルダ。 (からインポートした後 Score ファイル)

    削除 index.js と使用 import Score from './components/Score/Score';App.js

    より組織化された方法は 1 モジュールから1つの値のみを返す場合。

    エラーの理由:から値をインポートしています Score フォルダ。フォルダから値をインポートする場合、 index.js そのフォルダ内の値を返します。しかし、ここで index.js 値をエクスポートしていません。したがって、どちらかから値をエクスポートします index.js (解決策1)またはから値をインポートします Score 内部のファイル Score フォルダー(ソリューション2)

あなたの答え