React と React Native のスレ (481ﾚｽ)
上下前次1-新
395(1): 2022/09/29(木)09:52 ID:clewMKt/(1/2) AAS
>>393
hooks限定である必要はないと思うが...
396: 2022/09/29(木)10:45 ID:6obmiat7(4/4) AAS
>>395
元々コンテナコンポーネントに書く必要がないようなロジックの話をしてるつもりはないんだよなぁ
React無関係なロジックを普通の関数に切り出す話ならReactスレで話さなくていいだろ
状態やライフサイクルなどReactに依存したロジックを切り出すならuseStateやuseEffectを使う関数になりそれはカスタムhooksと呼ばれるということ
397: 2022/09/29(木)10:54 ID:clewMKt/(2/2) AAS
ステートレスなロジックも意味なくhooksとして？実装するとでも言うのかい？
398: 2022/09/29(木)11:20 ID:vsyIBCv9(2/2) AAS
ごめん、一番聞きたかったのは
コールバック等使ったpropsの逆流（リフトアップ？）のことなんだけど
例えば、ダイアログ等実装する場合recoil使ってstate管理すれば簡単に実装出来ると思うんだけど
わざわざリフトアップする必要ってあるの？？
399: 2022/09/29(木)11:41 ID:RG+lw4Yl(1/2) AAS
俺の場合はコントロールの状態は極力propsで渡して
そのコントロール起因で発生した状態の変更は
そのコントロールの外部からディスパッチして
またコントロールのpropsとして再投入するパターンに落ち着いた
400: 2022/09/29(木)12:43 ID:N+5tSsEm(1) AAS
全部props渡しはどのコンポーネントが何のデータに依存してるか明確にわかるのが好き
401: 2022/09/29(木)13:42 ID:RG+lw4Yl(2/2) AAS
propsて受け取った状態を
内部てstateとして別管理すると嵌まるパターンが多いね
402(1): 2022/10/04(火)20:36 ID:R+w5qX88(1/2) AAS
React勉強中です
テーブルが例えば最大行数20行として、新しいデータを取得するたびに先頭行に追加、末尾データは削除、というのをしたいです。
以前直接DOMを操作していたときは、テーブルのElementに対し、insertRow()、deleteRow()を行っていました。
これをReactでやろうとした時、テーブルの各行のデータを配列で持っているとすると、下記のようにmapを使って各行のHTMLを生成するというやりかたがあるかと思いますが、
この場合は行の追加の度に全行が再レンダリングされてしまいますよね？
const table_data = ['a', 'b', 'c', 〜]
return(
<tbody>
{
table_data.map((val) =><tr><td>{val}</td></tr>)
}
</tbody>
)
前述のような先頭行に追加、末尾行は削除、というのをReactでやるとすると、どいういう感じの処理になるのでしょうか？
ヒントをいただけると助かります。
まずは、1行ずつをコンポーネントにするのは必須ですかね？
403(1): 2022/10/04(火)21:43 ID:ZExEo8/e(1) AAS
>>402
> 先頭行に追加、末尾行は削除
keyを調べれ
> 1行ずつをコンポーネントにするのは必須
んなこたぁない
404: 2022/10/04(火)22:08 ID:R+w5qX88(2/2) AAS
>>403
ありがとうございます。
なるほど、keyが同じで中身が変わらなければ再レンダリングされないのですね。
だから必ずkeyを付けるんですね。
405(1): 2022/10/05(水)00:29 ID:zhKCpglg(1) AAS
keyはどのみち付けないとWarning出るね
バックエンド連携とかどうするつもりなのか知らんけど
普通に先頭20件だけ表示するように指定してやって
useEffectでtable_dataを監視してやればすんなり行きそうだけどなぁ
406: 2022/10/05(水)10:49 ID:RsX5Dgpw(1) AAS
>>405
ありがとうございます。
useStateでテーブル用データの配列を管理し、データ取得されるたびにその配列の先頭に追加、sliceで20件だけ切り出し、という方法でやりたいことはできました。
ユニークなkeyを付けることで再レンダリング対象が更新部分だけになるのも確認できました。
データはWebSocketで受信して取得しますが、どなたかのサイトで紹介されていた、コンポーネント内のuseRefでWebSocketオブジェクトを持ち、useEffectで初回時のみに接続するという方法でとりあえあず動作しました。
407: 2022/11/05(土)23:06 ID:uWVkhL+y(1) AAS
react native詳しいニキ教えて
下部に表示されるメニューバー（以下、Menu）のコンポーネント作ってて
ページによって表示/非表示の設定をしたいんだ
各ページコンポーネントでMenuを直接呼び出すような作りにすれば確かに実装出来るけど
ページが切り替わった時点でアニメーションが途切れるし、なによりナンセンスな気がする
で、次の案。
App→Main→各ページという構成を取ってるけど
MainでMenuを呼び出すようにした。
で、これをRecoilで管理するboolean型のグローバルstateで表示/非表示にする。
あとは各ページの初回レンダリング時にstateの値を書き換えるだけで解決……と思ったけど
前のページにバックしたときに改めてstateの値が書き換わらないんだ。
これを踏まえて何かいい方法ないですか？
408: 2022/11/05(土)23:47 ID:ocl/XM+V(1) AAS
知らんけどrecoil-syncってのがあるらしいな知らんけど
409: .NET MAUI HighSchool 2022/11/11(金)12:32 ID:kw0okeTL(1/3) AAS
Metaが倒産したらReactどうなってしまうんだ？ってレス見たんだけどほんとどうなってしまうん？
誰かに買われるとか？？？
410: 2022/11/11(金)12:42 ID:BY70aiHB(1) AAS
Vercelは確実に欲しがる。Remixを買ったShopifyも欲しがるかも。Googleが掻っ攫うかもしれない
411: .NET MAUI HighSchool 2022/11/11(金)12:43 ID:kw0okeTL(2/3) AAS
やっぱり大手に買われるのか…
412(1): 2022/11/11(金)13:19 ID:P8cdLDDc(1) AAS
React NativeはMSが持っていきそう
413: .NET MAUI HighSchool 2022/11/11(金)13:20 ID:kw0okeTL(3/3) AAS
>>412
ありえそう
OfficeとかReact Nativeやしな
414(1): 2022/11/21(月)04:31 ID:9tdtmBpP(1) AAS
プログラマーならview定義もJavaScriptでする方が幸せじゃないですか？
外部ﾘﾝｸ:zenn.dev
415: 2022/11/21(月)19:55 ID:WHQv7Vmu(1/2) AAS
>>414
入ったプロジェクトがこんな状態になってたらマネージャーかリーダーの判断力があやしすぎて即転職考えるかもしれん
416: 2022/11/21(月)20:03 ID:WHQv7Vmu(2/2) AAS
(試みとしては面白いと思うけど)
417: 2022/11/21(月)20:32 ID:530w1iq8(1/2) AAS
hyperTextじゃん
418: 2022/11/21(月)20:33 ID:530w1iq8(2/2) AAS
textじゃねえやHyperScript
419: 2022/11/21(月)20:54 ID:F57+7x5h(1) AAS
ClojureScriptでReact使うのがまんまそんなだった
Lisp界隈の人はなんでもS式だからな
420: 2022/11/22(火)07:44 ID:XlS3y7OH(1) AAS
tic-tac-toe。今更変わらないのはわかってるけどpure jsで何の不便もないじゃん。
外部ﾘﾝｸ:jsfiddle.net
421: 2022/11/22(火)09:58 ID:J3G+pIhw(1) AAS
それならここに来る必要ないやろ
422(1): 2022/11/23(水)04:11 ID:TMK4+5Kw(1) AAS
reactでjsx使わない話なんだけどダメ？
タグ手打ちで補完が効かないhyperscriptとかもっとマイナーななんとかhelperとか
誰も使ってない怪しいライブラリに頼らずとも自分で200行コード書くだけで
jsx使わないで済むのは自分は衝撃だった。
見たことない構文だけどただのjsなんで補完もインデントも問題なし。閉じタグ書かなくていい。
[div, {className: 'game-info'},
[div, status,],
[ol, moves,],
],
423: 2022/11/23(水)04:25 ID:mlnYnqLg(1) AAS
jQuery絶対王者
424: 2022/11/23(水)05:07 ID:AN01Xhf0(1) AAS
>>422
チームで合意が取れてれば良いんじゃないかな
自分は好みとかあまりなくて標準だったりプロジェクトだったりに適応するのが好きだから
プロジェクトでそうなってたら合わせるかな
もちろん自分が一からやるなら現時点で大勢が使ってる標準的なjsxを使うし
上下前次1-新書関写板覧索設栞歴
あと 57 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ
ぬこの手 ぬこTOP 0.007s