【マルバツゲーム】盤面を描画するの巻
・JSXの構文の中に波かっこ{}を使うと、JavaScriptの式が書けます。つまり、変数(プロパティ)を参照したり、関数(メソッド)が呼び出せるのです。
・Js・CSSが読み込めてない →えっていうかそもそもHTMLの知識なのでは
いまだにフォルダ構成とCSSの関係がよくわかっていない…
→ ☆chromeにreact用の拡張があるのでこれ使いました。https://qiita.com/pepo/items/beccd5f1e83ce2b93376
・このサイトのこの考え方超重要 「よくある効かないcssの原因」
①外部CSSファイル自体がそもそも読み込めていない
②idなのかclassなのか
③名前の付け方があっているかの確認
④そのcssの優先順位があっているかの確認
⑤cssの記述が全角文字や書式のミスで動いていない
…
書いた人は絶対頭イイ
http://www.tecblo.com/other/1475.html
→ 外部ファイル化せずべた書きしたら通りましたー。 なんだそれ…
属性は変数としてコンポーネントのpropsプロパティに納められます.
例のサイト様の章立てに沿って書いてみました。
■01 コードを書く前に素材を整える
■02 マス目の要素をつくってページに差し込む
■03 9マスの盤面を組み立てる
[
class Square extends React.Component {
render() {
return (
<button className="square">
{this.props.value☆}
</button>
);
}
}
]
[
class Board extends React.Component {
renderSquare(i) {
return <Square value☆={i} />;
}
]
■04 クリックしたマス目に印をつける
[・ECMAScript 6には、アロー関数式=>が採り入れられました]
このサイトほんとにすごい 天才か
記述がすごく豊富 偉い すごい