I'm just starting with react. I've seen that most state are comprised of simple data such as object, string, numbers, etc... I was hoping to be able to use a renderless class to hold and control a state like this:
import React, { Component } from 'react';
import HumanPlayer from "./players/HumanPlayer";
import Money from "./Money";
import ComputerPlayer from "./players/ComputerPlayer";
import Deck from "./cards/Deck";
import HumanBoard from "./views/PlayerBoard";
import Score from "./views/Score";
import ComputerBoard from "./views/ComputerBoard";
import Controls from "./views/Controls";
class BlackJack extends Component {
constructor(props) {
super(props);
const human = new HumanPlayer({
money: new Money({
currency: Money.USD,
amount: 100
})
});
super(human);
const computer = new ComputerPlayer;
this.state = {
human: human,
computer: computer,
deck: new Deck
};
}
render() {
const me = this;
return (
<div className="BlackJack">
BlackJack
<HumanBoard player={me.state.human}/>
<Score money={me.state.human.getTotal()}/>
<ComputerBoard player={me.state.computer}/>
<Controls/>
</div>
);
}
}
export default BlackJack;
Is there a good way to do this or is this more of an anti-pattern?
Aucun commentaire:
Enregistrer un commentaire