React と React Native のスレ

2019/03/09(土) 21:29:27.97ID:AJ6jPa0v
Q. Reactってなんですか?
A. ブラウザで動くウェブアプリを作るJavaScriptフレームワークです

Q. React使えば、iOSやAndroidアプリも作れるのですか?
A. 作れません。(ブラウザでなら動きます)

Q. でも動くってきいたんだけど?
A. それはReactではなくReact Nativeです。

Q. React と React Native は同じようなものじゃないの?
A. 設計思想が同じなだけで、中身は全くの別物です。

Q. React Nativeで作ればブラウザで動くの?
A. 動きません。(動くようにするサードパーティ製のライブラリならあります)

Q. React と React Native でソースコード共通化できるの?
A. UIの部分は共通化出来ません。UI以外の部分なら頑張れば

Q. このスレはどっちの話題のスレなの?
A. 両方です。どっちの話題をしているかは文脈で判断してください
2020/05/24(日) 13:54:49.55ID:rk0sziuW
>>54
システム全体で必要なのはRedux
Postする為にそのFormだけで必要なものはuseState
って使い方してる

共存って点で言うならHooksか旧型式かを共存させなきゃ別にいいと思う
2020/06/09(火) 16:01:35.59ID:mEfhV+3L
React.ComponentとSuspenseを使ってリストを読み込んで表示するプログラムを書いているのだけど
renderでメンバ関数を呼んで読込するとthisがつく変数(stateとか)が全てリセットされるよどうして?
リセットされる変数をstaticにすると動くようです
2020/07/25(土) 07:59:44.00ID:e6nmtc2O
人工知能フレームワークのGpt-3がReact上で動くんだよなあ
2020/07/25(土) 14:10:16.00ID:ZlqyHRW3
>>56
まだそんな事やってるのか?
早くHooksに移行した方がシンプルで使いやすいよ
59デフォルトの名無しさん
垢版 |
2020/08/05(水) 20:39:39.66ID:HaLefuVq
reactでフォームの連動させたいんだけど
良いチュートリアルやサンプルをおしえてください

調べ方でも大丈夫です
2020/10/06(火) 09:47:28.33ID:FaC1oBor
>>59
連動?
って具体的に何やりたいの?
2020/10/06(火) 15:47:26.50ID:3JbOTVG0
>>59
公式を嫁!
それか、オレの知り合いの本を嫁!
以上。
2020/10/07(水) 08:13:26.21ID:9X+ETi/j
他のフォーム要素を同時にどうかしたいって仮定するとonClickイベントやonChangeイベントのコールバックにメソッド噛ませればいいんじゃない?
2020/10/11(日) 20:19:56.38ID:/PPF0LFF
Html,Javascriptのソースコードをreact nativeに書き直してるけどDom要素のID管理していたのを書き直すのが辛すぎる

何かよいライブラリないかなぁ
64デフォルトの名無しさん
垢版 |
2021/01/04(月) 01:07:02.79ID:EMrQXkgT
iOSやAndroidアプリを作りたくてprogateのhtmlとJavaScriptと reactまでやったんですが、次に何をすれば良いか分かりません。僕は次に何を学べばいいですか?
65(u_・y)
垢版 |
2021/01/04(月) 11:37:19.32ID:oZidFLop
(u_・y)順序からしておかしくね
(u_・y)Androidアプリ作るならまずAndroid上でハローワールドだろ
(u_・y)Googleになんかアカウント作って登録あれこれやるんじゃねーの
(u_・y)Win以外のアプリを作るので難関になるのはそういった手順と環境構築絡みなので、
(u_・y)周りに先生がいない状況で独学初心者がいきなりAndroidアプリってのはハローワールドまでに時間かかるぞ
2021/01/12(火) 01:34:10.49ID:dF2LSabj
公式のドキュメントに全部書いてあるから全部読め
2021/01/21(木) 19:04:19.07ID:RZX+x1N+
Java から来て、最近 React はじめたんだけど、MVC 思想的なのは最近フロントエンドではなくなっていってる感じなん?
せめて View 部分は分けないと気持ち悪いんだけど、チュートリアルみても割とごちゃまぜなのよね…
68デフォルトの名無しさん
垢版 |
2021/02/14(日) 03:47:14.57ID:wyKYn9A/
React の hookを初めてみてるんだけど、
これClassベースの機能で提供できないのかな?

functionなのに永続化を無理やりやってるようでコード読みづらい。
その永続化をuse接頭語のみで判断しなければならないという...

functionじゃなきゃhookの機能が提供できない??というモヤモヤ感が払拭できないです。
2021/02/14(日) 04:24:42.10ID:qcnkr3Yb
元々はクラスベースで提供されてた機能を関数コンポーネントでも使えるようにしたのがhookやで
2021/02/14(日) 04:26:06.17ID:o9olz+i9
>>68
目に見える副作用をフレームワーク側に追い出して
ユーザーからは副作用がないようにしてる設計は素晴らしいと思うけどね
71デフォルトの名無しさん
垢版 |
2021/02/14(日) 04:47:15.25ID:wyKYn9A/
>>70 副作用がないようにしてる設計
それがclassベースでは出来ない??って疑問。

>>69
ならhookがclassより上という事ではなくなる。
でも公式コメントでもclassよりhookのモデルが優秀みたいな書き方。
ただclassは無くさずこのまま残しますみたいな。

なんかfunctionを無理やり生存期間拡張してるところが
感覚的に違和感モヤモヤ。

hookの機能をclassで実装するとやりづらい箇所って、
同名メソッドを複数定義できる箇所ぐらい?
2021/02/14(日) 04:59:08.67ID:o9olz+i9
>>71
もちろんできるしそれを手動でやってきたのがクラス
でもsetState呼ばなかったり状態にオブジェクトが必須だったりで色んなミスが起きやすかった
それをフレームワーク側で全部やって
ユーザーが書きやすくするのがHooks
人間がやるよりフレームワークがやる方が信頼性が高いし賢いからそこは任せた方が良いよねってことで生まれたと勝手に思っている
73デフォルトの名無しさん
垢版 |
2021/02/14(日) 05:41:48.27ID:wyKYn9A/
>>72
だから、それ(hook)をclassべースで提供できないの?って言ってんの。
2021/02/14(日) 05:48:13.99ID:eZAyHvHf
クラスはhookなしで同じことができるから提供する必要がない
2021/02/14(日) 07:45:04.97ID:o9olz+i9
>>73
いやだからsetStateという汎用的な物しか提供できないっことね
stateを自分で好き勝手いじれるのに
それをライブラリが管理するって無理でしょ
hooksは内部で対応するコンポーネントとその状態を管理してるから
ライブラリとして提供できる
76デフォルトの名無しさん
垢版 |
2021/02/14(日) 13:32:40.22ID:wyKYn9A/
>>75
分かんない人だな。
なんで今のclassベースの実装をこの話に持ち込むの。

hookの機能を”function”でなく、jsの”class”で実現できないの?っていう疑問なの。
2021/02/14(日) 14:00:51.86ID:+4ZWExbH
お前もわからずやだな
useStateだろうがuseEffectだろうがuseCallbackだろうがuseRefだろうがclassコンポーネントはhookなしで同じことが実現できてるだろ
2021/02/14(日) 14:19:02.14ID:wyKYn9A/
hookを知らないやつだったか。アホらし。
2021/02/14(日) 14:34:40.65ID:kA8DCabn
時系列的には

クラスコンポーネント: 状態を扱える

"ステートレス"関数コンポーネント: 状態を扱えない

関数コンポーネント+hooks: 状態を扱える

と発展してきた
つまりhooksはクラスコンポーネントができていたことを関数コンポーネントでもできるようにするために後から追加されたもの
ただし

クラスコンポーネント: 状態をコンポーネントが管理する
関数コンポーネント+hooks: 状態をフレームワークが管理する

という違いがある
これが今後のconcurrent modeやserver componentsで大きな違いになってくる
フレームワークができることを増やすにはコンポーネント側の自由度は低い方がよくてそれがpureな関数コンポーネント
2021/02/14(日) 14:46:29.94ID:wyKYn9A/
>>79
この解説から見ると、自分の疑問は
"状態をフレームワークが管理する"
にはclass実装では不利なのか?向かないのか?
って事になる。ね。
2021/02/14(日) 15:15:15.08ID:kA8DCabn
クラスコンポーネントのインスタンスはthis.〜で自由に状態を扱えてしまうからフレームワークには都合が悪い
そこをthis禁止のように縛っていくとただの関数でいいやってなる
2021/02/14(日) 16:39:29.19ID:DVWK/pJu
useCallbackみたいな単なるラッパー関数がclassにも欲しいってこと?
なんかそう言うパッケージ見たことあるぞ
2021/02/14(日) 16:59:03.97ID:FekQTk3J
classコンポーネントにuseCallbackはいらんやろ
前はbindしたり面倒だったけどstage3のclass fields使えばこれだけ

class Foo extends React.Component {
 handleClick = (ev) => {...}
2021/02/14(日) 21:01:15.04ID:K2VDjDyL
Ruby on Rails では、控えめなJS フレームワークのStimulu もある

規約で、HTML のdata-controller 属性で、JSファイル名・コントローラーが決まるので、
そこにイベント処理を書くだけ

DOM・コントローラーは、多対多

1つのDOMは、複数のコントローラーで処理できる。
HTML内で、同じコントローラーを複数定義できる

Stimuluは、this を使う。
同じコントローラーを複数定義したら、別のインスタンスを作る

<li data-controller="a">1</li>
<li data-controller="a">2</li>
2021/02/14(日) 21:03:03.46ID:NOmukaW1
ス・レ・チ
2021/02/15(月) 02:51:04.90ID:E7fw/gtI
マジで障害者かな?
この板に巣食ってる人がいるのは認識してたけど
87デフォルトの名無しさん
垢版 |
2021/06/18(金) 09:52:07.92ID:IQL7BQ/N
React Hooks + Reduxの利点を述べた記事をいくつか読んだのですが、
MVCでだめな理由がよくわかりませんでした。

複数のModelがReduxのStoreに一本化される: Modelをシングルトンにして、
Storeの内部で区分するところをModelのメンバとして区分する。

ViewからはActionを発行してReducerを通さないとStoreを更新できない:
ViewはControllerに登録されたメソッドを通してしかModelを更新できない。

Storeの更新はViewに自動的に反映される。
Model(とそのメンバ、孫メンバ)がObservableであれば、Modelの更新を
自動的にViewに反映させることができる。

ではだめなんでしょうか。
88デフォルトの名無しさん
垢版 |
2021/08/10(火) 10:10:26.07ID:0SSgF6Zh
Reactで関数コンポーネントで本気実装始めたんだが、
関数コンポーネント面倒くさ過ぎじゃね?

関数コンポネント入門位の実装なら問題なかったんだが、
ちょっと込み入ったの実装しようと思ったら
クラスじゃないんで、コンポーネントの自前メソッドを(子から親、親から子)公開するのとか
そのTS型定義をどうするのとかうまく解決できんのか?これwww
2021/08/10(火) 10:18:58.12ID:Yti8n+JL
込み入った実装ってだいたい設計から間違ってるよね…
90デフォルトの名無しさん
垢版 |
2021/08/10(火) 10:22:58.46ID:0SSgF6Zh
>>89
あんたが考えてんの具体的にどのレベルだ?
こっちはネイティブアプリ同等の、ガントチャート状のスケジューラーの実装なんだが
コンポーネント間のメソッド呼び出しは結構多いぞ
2021/08/10(火) 11:17:59.39ID:x9cqqxVb
奇遇だな、Webとネイティブ両用のスケジュール管理系やってるよ
推測だけどコンポーネントとデータ構造(いわゆるモデル)が分離できてないんだろうと思うわ
同じものをネイティブでも作ることを仮定して共有できるところ(モデル)とできないところ(レンダリング)にわけて考えてみるといんじゃね
92デフォルトの名無しさん
垢版 |
2021/08/10(火) 11:27:05.53ID:0SSgF6Zh
>>91
!!
まだReact不慣れで困ってる
半年前にReact初めてそちはクラスベース(TS)だったので、
実装できない事は無かったのでこういった苦労はなかった

>>コンポーネントとデータ構造(いわゆるモデル)が分離できてないんだろうと思うわ

どうだろう?
あんまり業務的なことを書くわけにはいかんけど、
親パネル側から、配置されたコンポーネントの機能を呼び出したいんだが、
コンポーネントが今回クラスから関数に変わったんで、
コンポーネント側にコンポーネント固有の機能(クラスん時はメソッド)が実装しずらくなって困ってる

関数コンポーネントだとここにメソッドとか置かないもんなの?
93デフォルトの名無しさん
垢版 |
2021/08/10(火) 12:03:49.33ID:0SSgF6Zh
関数なんだから、オブジェクト指向的な実装はムリなんだろうな
とりあえず、

・クラス → モジュール
・プロパティ → モジュールの関数の引数
・メソッド → モジュールの関数

に置き換えて実装してみるわ
2021/08/10(火) 12:28:03.76ID:dmkhwQTT
関数であれクラスであれ(つかもっと前から)Reactのコンポーネントは渡されたデータ(Props)をただベタッとレンダリングするだけってのがコンセプト
その超基本的なところをわかってなさそう
他の言語やフレームーワークの考え方のままReact始めたのか知らんけどそれをReactに置き換えるよりReact流の考え方を身につけたほうがいいと思うわ
95デフォルトの名無しさん
垢版 |
2021/08/10(火) 12:36:48.42ID:0SSgF6Zh
いや、アトミックデザイン的に機能分割して
その単位をオブジェクト指向的にデザインしてたわー−(前回プロジェクト)

でもRender()しかやらん関数と、
その外にはみ出た処理で細切れ関数だらけになって、
コード読みにくいは、実装も美しくならんわー− ( ノД`)ドスル
96デフォルトの名無しさん
垢版 |
2021/08/10(火) 14:00:37.21ID:8kvO2lBn
Redux素晴らしいって言ってた人たちは今息してんのかな
97デフォルトの名無しさん
垢版 |
2021/08/10(火) 14:08:07.90ID:UtkECLI3
>>95
この流れでアトミックデザインを出してくるのものすっごく薄っぺらい
2021/08/10(火) 14:15:30.49ID:i+IrTlV6
>>97
アトミックデザイン使わず
あなたが表現してあげたら?
99デフォルトの名無しさん
垢版 |
2021/08/10(火) 14:57:48.57ID:UtkECLI3
>>98
単純にいらんやろ
「コンポーネントをオブジェクト指向でデザインしてた」で十分だしそれがReactらしくないって話やん
2021/08/10(火) 15:49:45.99ID:LAvum0nL
>>99
コンポーネントの分割単位が伝わらんよ
101デフォルトの名無しさん
垢版 |
2021/08/10(火) 16:58:18.35ID:UtkECLI3
>>100
この流れで分割単位の話なんかいらないじゃん
88から読み直してみ
2021/08/10(火) 18:51:43.55ID:M/It2Akn
> コンポーネント間のメソッド呼び出し

??????????
2021/08/10(火) 19:15:22.44ID:Yh+H2qBA
データフェッチに swr を使う前提であれば Recoil より swr で状態管理 hooks 作る方が良いんだろうか
両方使う例があるなら見てみたい
2021/08/10(火) 19:38:32.34ID:Qo7qEUjv
>>103
swrはサーバーサイドの情報を取ってきてキャッシュするものだから扱う状態はサーバーステートとでも呼ぶべきものなんだよね
だからクライアントサイド固有の状態を
swrで扱おうとは俺は思わない
apolloなんかはクライアントのステートも一緒に扱えるのを売りにしてるけど余計な手間をかけてるだけにしか見えない

コンポーネントのローカルステート→useState, useReducer
クライアントのグローバルステート→redux, recoilなど(俺は好かんがcontextもここに入る)
サーバーステート→swr, react query, apolloなど

と使い分けてる
2021/08/10(火) 20:04:49.62ID:Yh+H2qBA
>>104
参考になるありがとう
依存ライブラリ増加を嫌うことへの妥協案で >>103 を考えてたけどその方が役割分担が明確だから状態と取得キャッシュが混合するより状態を把握しやすそう
2021/08/11(水) 19:43:56.70ID:u2eXJHJo
>>88
ちゃんとhooks使ってるか?
2021/08/11(水) 20:53:01.89ID:UmYmX+C7
>>106
ぶっちゃけクラスの方が書きやすく
コードも綺麗だ(実力高い人の場合)

関数コンポーネントは
実装の自由度がhocksbニその拡張ぐらb「しかなく
フレームワーク的なのが造りづらく感じてる
2021/08/12(木) 03:09:43.60ID:YWc6Jioi
実力が高いw
本気でそう思ってるならqiitaでもzennでもどこでもいいから記事に書いてみろよ
間違いなく日本中からボロクソに叩かれるよ
2021/08/12(木) 03:23:50.10ID:c9YvWIsD
>>108
受け答えから見て実力が低そう
2021/08/12(木) 17:08:42.90ID:qp3m1ZO5
>>107
クラス記法はこういう欠点があるからなあ
ttps://speakerdeck.com/sonatard/coheision-coupling?slide=24
111デフォルトの名無しさん
垢版 |
2021/08/12(木) 17:57:27.67ID:/tY+Xjfe
大方の単細胞腦は、SQLDBとNoSQLDBの時がそうであったように
関数コンポーネントとクラスコンポーネントのどちらかに
絶対的な優劣をつけたがってんじゃね?

今回も関数コンポーネントがマッチする場合と、
そうでない場合がありそうに見える

とくに、関数コンポーネントは
コンポーネントのインスタンスが自由に扱えない(扱えなさそう)から
そういった処理の実装時に(React用で無いJSライブラリを無理やり動かしてたようなケースとか)
トラブりそうな気がする
112デフォルトの名無しさん
垢版 |
2021/08/12(木) 18:16:18.47ID:mo2yl2b6
典型的な「分かってないことが分かってない」ヤツ
2021/08/12(木) 18:29:54.23ID:1fVVrAZN
優劣はどうでもよくてクラスコンポーネントは互換性のために残されてるだけってのがReactの立場
新しい機能の中には関数コンポーネントからしか使えないものが出てるしこれからも増える
そもそも対等な選択肢ではないから議論する価値がない
状況に合わせて適応するってのが一番大事
114デフォルトの名無しさん
垢版 |
2021/08/12(木) 18:43:59.17ID:/tY+Xjfe
>>113
>> 互換性のために残されてるだけってのがReactの立場

なんと!(; ・`д・´)
2021/08/12(木) 18:53:29.47ID:1fVVrAZN
今の公式ドキュメントやチュートリアルは古くてクラスコンポーネントが大きく扱われてるのが本当に良くない
それはReactチームも分かってるからドキュメントを全面的に書き換えてる最中
もちろん関数コンポーネントとHooksメインで
116デフォルトの名無しさん
垢版 |
2021/08/12(木) 19:01:46.19ID:/tY+Xjfe
>>115
なんと!(; ・`д・´)
117デフォルトの名無しさん
垢版 |
2021/08/26(木) 15:41:55.94ID:CFvcLd/B
フック初心者ですが
「フックは関数のトップレベルのみで呼び出してください。」
とあります。この関数は関数コンポーネントの意味で合ってますでしょうか?
118デフォルトの名無しさん
垢版 |
2021/08/26(木) 15:51:22.45ID:CFvcLd/B
<Button1>と<Button2>で
それぞれ内部でuseStateを使ってたら

<Button1>
<Button2/>
</Button1>

はNGになるのでしょうか?
2021/08/26(木) 16:38:00.65ID:gityixOl
>>117
> この関数は関数コンポーネントの意味

違う
ifやforなどの制御構造の内側から呼び出すなということ
要するに関数コンポーネントの呼び出しごとにhookが実行されたりされなかったりしてはいけない
なので?:や&&などと組み合わせるのもダメ
2021/08/26(木) 16:39:25.72ID:gityixOl
>>118
それはOK
それぞれのコンポーネントは独立してるから問題ない
2021/08/26(木) 16:45:57.37ID:KmLAFOYJ
>>120
有り難い!

しかし判り辛いですね
お題目だけだと
公式に具体例を上げてくれないと
勘違いしそう...
2021/08/27(金) 13:34:41.69ID:gabOubiT
hookの実行順でレンダリング毎の同一性を保証してるってわかってれば当たり前のことなんだけどね
2021/08/27(金) 13:54:27.15ID:KVovKrAi
順番で状態を管理してるって一昔前の考えだと
なんだそりゃって感じになるんだけど
そもそも自分で管理するのはクソだから
全部フレームワークに任せちゃえってなってる
React凄い
2021/08/27(金) 15:19:14.34ID:B8clkCSU
翻訳の問題かもしれんけど
「関数のトップレベル」という表現が判りずらい
「関数内部の最初の行あたり」で良くないか?
2021/08/27(金) 15:45:49.48ID:nZgJAtld
function Foo(props) {
 if (props.flag) useEffect(...)
 ...

最初の行だけどアウト
2021/08/27(金) 15:48:30.00ID:KVovKrAi
「同じフックが常に実行されるようにすること」
これでよくね?
2021/08/27(金) 15:49:19.59ID:B8clkCSU
関数のトップレベルの訳としての話しだよ(´Д`)
2021/08/27(金) 15:57:29.79ID:rY0RNuZ6
モジュールのトップレベルもわからない?
それじゃトップレベルawaitも分からないしJSやるの無理やろ
129デフォルトの名無しさん
垢版 |
2021/08/28(土) 04:17:28.74ID:5cd2kTad
useCallback これっている?
fnのMemoならMemoってキーワードも名称から抜けてるし
useMemo(() => fn, deps) と同じならなおさら...
2021/08/28(土) 04:35:56.44ID:52Q/kK4D
fnをファットアローでインラインに書いてみ
131デフォルトの名無しさん
垢版 |
2021/08/28(土) 04:42:56.91ID:5cd2kTad
うー−ん!初学者だからなのか意味わからんです
132デフォルトの名無しさん
垢版 |
2021/08/28(土) 04:46:30.48ID:5cd2kTad
useCallback(fn, deps) が useMemo(() => fn, deps) こう書けるって事なんじゃないですか?
2021/08/28(土) 04:54:08.75ID:aWJHFkdS
useCallback((event) => {...}, deps) を useMemo(() => (event) => {...}, deps) って書きたいかって話
134デフォルトの名無しさん
垢版 |
2021/08/28(土) 05:10:24.97ID:5cd2kTad
>>133
良い!
そっちのが良い!

fnのメモなのに、useMemoCallback()になってないので直観的に思えない
初学者だと、ぱっと見CallbackするにはuseCallback()が必須に見える
理由はMemoの文字が入ってないから
2021/08/28(土) 06:24:50.37ID:P0+dXebs
それ言ったらuseMemoなんてuseState使えばいいし内部でstate使ってるのにuseNemoStateじゃないの直感的じゃないよね
136デフォルトの名無しさん
垢版 |
2021/08/28(土) 08:24:29.02ID:5cd2kTad
useCallback だと名称から、
コールバック使いますよ!の宣言に見えると言っている

実際はコールバックをメモしますよ!だから
コード読むとき直感的でないと言っている

実際、初学者で関数コンポネント内でコールバックを定義するときは
useCallback()を使わなければならないと思いこんでいる人が少なからず居ると思う
137デフォルトの名無しさん
垢版 |
2021/08/28(土) 10:18:42.44ID:rJz23Izt
Ionicと比べた場合のReact nativeのメリットはアプリの動作速度が速いところ?
2021/08/28(土) 10:19:30.77ID:rJz23Izt
ageてしまって申し訳ない
2021/08/28(土) 10:59:30.05ID:4fr1GGj/
>>136
初学者は
> useCallback()を使わなければならないと思いこんでいる
で丁度いい
140デフォルトの名無しさん
垢版 |
2021/08/28(土) 11:35:50.02ID:5cd2kTad
>>139
その心は?
2021/08/28(土) 12:30:31.08ID:fYYl/4Rj
>>140
不要なuseCallbackを書いても実害はない
超大規模ならチリツモでパフォーマンスに影響あるかもしれないが初学者には関係ない
対して必要なuseCallbackを忘れるとuseEffectやReact.memoに影響しうるが初学者には気付きにくい
最初は愚直にuseCallback書いて後から不要なケースを学べばいい
2021/08/28(土) 13:47:14.15ID:17Xf1f5F
>>141
なるほど!
その意味であえて関数名もそうしたんだろうか...
143デフォルトの名無しさん
垢版 |
2021/08/28(土) 23:14:15.55ID:5cd2kTad
https://medium.com/@dan_abramov/making-sense-of-react-hooks-fdbde8803889
"カスタムフックは技術的にはReact機能ではない" って

ステートレス関数に状態を保持する機能が
jsに元よりあるという事でしょうか?
2021/08/28(土) 23:39:41.08ID:tYNkdatt
カスタムフック===ユーザー定義フック
利用者(アプリケーション)で定義するものであってReactが提供する機能ではない
145デフォルトの名無しさん
垢版 |
2021/08/29(日) 00:17:55.75ID:V85oGWwE
>>144
それは了解してた!(質問を間違えた!)

フックを実現する技術(ステートレス関数に状態を保持する機能)は
JSに元からあるという記述が公式にあったようにおもうのだけれど、
それは何?って事が言いたかった...
146デフォルトの名無しさん
垢版 |
2021/08/29(日) 01:51:35.47ID:V85oGWwE
>>145
前のリンクの文意から推察するに、フックはreactの特別な機能じゃなく
JSのクロージャーと array.push と array.pop とかで実装できるって事かな?

誤りありましたらご指摘下さい
2021/08/29(日) 03:34:12.05ID:pzZWZODD
引用しろボケカス
2021/08/29(日) 12:10:00.26ID:OiCqCGE7
>>146
前のリンクの文意というのが

> Since Hooks are regular JavaScript functions, you can combine built-in Hooks provided by React into your own “custom Hooks”.

ら辺のことなら全然違う
Reactが提供する「組み込みフック」はJSの普通の関数だからそれを組み合わせて「カスタムフック」を作れると言ってるだけ
Reactが「組み込みフック」をどう実装しているかは触れてない
公式にあったという記述がなんのことかわからないがユーザー向けのドキュメントにReactの内部実装について書いてあるとは考えにくいので何か勘違いしてるんだろう
2021/08/29(日) 12:12:17.85ID:OiCqCGE7
もっともReactの組み込みフックがJS(+Flowtype)で実装されてるのは考えるまでもなく事実
詳しく知りたければソースを読めばいい
https://github.com/facebook/react/blob/main/packages/react-reconciler/src/ReactFiberHooks.new.js
150デフォルトの名無しさん
垢版 |
2021/08/29(日) 13:18:38.44ID:V85oGWwE
>>148
>>145 で言ったように、それは最初から解ってる
聞きたかったのは、フック自体の実装方法だよ!

>>149
そりゃそーーだ
2021/08/29(日) 13:41:49.73ID:1XJvcbdc
>>150
お前さぁ・・・
フック自体の実装方法が知りたいならそう書けよ
無関係なリンクや公式のことを書くから「そんなことは書いてない」「お前の勘違い」「ボケカス」って話になるんだよ
つーか5ch開く前にすることあるだろ
2021/08/29(日) 14:30:21.63ID:LbdE2Z/6
>>150
preactのソースを読め
わずか400行そこらでhooksを実装してる
俺がここ数年で見たコードで最も美しいコードだ
型もついてるからめちゃくちゃ読みやすい

https://github.com/preactjs/preact/blob/master/hooks
153デフォルトの名無しさん
垢版 |
2021/08/29(日) 21:46:55.62ID:V85oGWwE
>>152
(; ・`д・´)
2021/09/18(土) 13:05:29.83ID:ZtgFEKoc
reduxでいままでやってたような処理ってhooksではuseContextとuseRuducerの組み合わせでやるってことであってます?
2021/09/20(月) 00:13:37.74ID:fIDZ4k/Q
最近react始めて、リスト構造を持つようなデータの画面表示は配列のmap関数使ってjsx書けってのは理解したんだが、配列の要素の持つデータを一か所でも変えると残りの要素は全く変わってないのに全てレンダリング処理し直すことになるよな?
reactが差分を見てくれるから実際のDOMに反映されることはないんだろうけど、変更された要素のコンポーネントだけにレンダリング処理させる方法ってないんか?
レスを投稿する

5ちゃんねるの広告が気に入らない場合は、こちらをクリックしてください。

ニューススポーツなんでも実況