-1
コンポーネントに適切なコンテンツを表示する際に問題が発生しました。コンポーネントは必要なすべてのストアと小道具にアクセスできますが、これを確認するためにconsole.logが表示されますが、コンテンツのレンダリングに失敗します。条件付きレンダリングの問題（ReactJS）
Iセットアップような店舗：
const levelDefaultState = {
level: "second"}
そして、私は現在の状態に応じて物事をレンダリングしたい私のコンポーネントは次のようになります。
import React from 'react';
import { connect } from 'react-redux'
import LevelTwo from './level2/level2'
class LevelRenderer extends React.Component {
renderLevel(){
let currentLevel = null;
if (this.props.level === "second") {
currentLevel = <LevelTwo level={this.props.level} />
} else {
currentLevel = 'No level'
}
return currentLevel;
}
render() {
console.log('store', this.props.level)
let renderLevelConst = (this.props.level) ? this.renderLevel() : notRendered()
function notRendered() {
return 'Not rendered yet'
}
return (
<div>
{renderLevelConst}
</div>
)
}
}
const mapStateToProps = (state) => {
return {
level: state.level
}
}
export default connect(mapStateToProps)(LevelRenderer);
そして、状態が「あるにもかかわらず、それがレンダリングするすべての時間は「レベルなし」の文字列です。最初の状態を「最初に」設定してから、setTimeoutで「秒」に変更しようとしましたが、何も変更はありません。
私は間違っていますか？
let currentLevel = nullの後にconsole.log（this.props.level）を返すと何が返されますか？ ？ – bee
これは2回印刷されます： "store {level：" second "、sublevel：" 1.splash "}" –
を試してみてください：renderLevelのif（this.props.level.level === "second"）{} – bee