Reactのref
- ChildAのrefをParent経由でChildBに渡したいときは普通にpropsとして渡して、ChildB内でuseStateに突っ込んでイベント時に更新して使うことになるのかなあ、HTML内で使おうと思うと最初にもらったやつそのままセットしたらnullのまま更新されないからな〜
react-x3sb2v - StackBlitz: 試したやつ
- useImperative使って子コンポーネントのメソッドをrefで親に渡すとき、DOMも同時に渡したいなら子コンポーネント内で別にref作ってそれをImperativeのプロパティとして渡す形になる。というのもuseImperativeした時点で上書きしてしまっているのでDOMは明示的につけてあげないとアクセスできなくなるから。参考
Intermediate CSS
- レイアウトの根幹をなすのはBox。Content<Padding<Border<Margin
- width100%というのはつまりparentの利用可能なサイズの100%をContent-boxにセットするということなので、素のままmarginとかつけてると100%+marginで当然画面からはみ出す。当たり前だけどちゃんと立ち止まって考えたことなかった。
- n回やってることではあるけどブラウザはCSSを右から解釈する。
.parent .childみたいな指定の仕方だと、せっかく.childにはまるものを見つけても、.parentを探しにbodyまで遡ってしまうので無駄が発生する。.parent>.childなら直属の？親までしか見に行かないからできるだけこっちを使おう。 box-sizing:content box/border boxってこういうことか〜（今更すぎる) 効果はわかってたけどプロパティの名前の意味わかってなかった。- inline要素はwidth/heightが設定できないにもかかわらず、inspector上ではwidthが効いているように見えてしまう。(無効なプロパティにワーニングマークが出るようなEffectがない)
- 1em = 1 font size。
- 結局、フォントの文字が実際に1emにおさまるかどうかはフォントの作り手次第なので実装側ではどうにもできない。
- page zoomはpixel自体が大きくなるからフォントサイズとは関係がない。
