React と React Native のスレ (481ﾚｽ)
上下前次1-新
64: 2021/01/04(月)01:07 ID:EMrQXkgT(1) AAS
iOSやAndroidアプリを作りたくてprogateのhtmlとJavaScriptと reactまでやったんですが、次に何をすれば良いか分かりません。僕は次に何を学べばいいですか？
65: (u＿・y) 2021/01/04(月)11:37 ID:oZidFLop(1) AA×
66: 2021/01/12(火)01:34 ID:dF2LSabj(1) AAS
公式のドキュメントに全部書いてあるから全部読め
67: 2021/01/21(木)19:04 ID:RZX+x1N+(1) AAS
Java から来て、最近 React はじめたんだけど、MVC 思想的なのは最近フロントエンドではなくなっていってる感じなん？
せめて View 部分は分けないと気持ち悪いんだけど、チュートリアルみても割とごちゃまぜなのよね…
68(1): 2021/02/14(日)03:47 ID:wyKYn9A/(1/6) AAS
React の hookを初めてみてるんだけど、
これClassベースの機能で提供できないのかな？
functionなのに永続化を無理やりやってるようでコード読みづらい。
その永続化をuse接頭語のみで判断しなければならないという...
functionじゃなきゃhookの機能が提供できない？？というモヤモヤ感が払拭できないです。
69(1): 2021/02/14(日)04:24 ID:qcnkr3Yb(1) AAS
元々はクラスベースで提供されてた機能を関数コンポーネントでも使えるようにしたのがhookやで
70(2): 2021/02/14(日)04:26 ID:o9olz+i9(1/3) AAS
>>68
目に見える副作用をフレームワーク側に追い出して
ユーザーからは副作用がないようにしてる設計は素晴らしいと思うけどね
71(1): 2021/02/14(日)04:47 ID:wyKYn9A/(2/6) AAS
>>70 副作用がないようにしてる設計
それがclassベースでは出来ない？？って疑問。
>>69
ならhookがclassより上という事ではなくなる。
でも公式コメントでもclassよりhookのモデルが優秀みたいな書き方。
ただclassは無くさずこのまま残しますみたいな。
なんかfunctionを無理やり生存期間拡張してるところが
感覚的に違和感モヤモヤ。
hookの機能をclassで実装するとやりづらい箇所って、
同名メソッドを複数定義できる箇所ぐらい？
72(1): 2021/02/14(日)04:59 ID:o9olz+i9(2/3) AAS
>>71
もちろんできるしそれを手動でやってきたのがクラス
でもsetState呼ばなかったり状態にオブジェクトが必須だったりで色んなミスが起きやすかった
それをフレームワーク側で全部やって
ユーザーが書きやすくするのがHooks
人間がやるよりフレームワークがやる方が信頼性が高いし賢いからそこは任せた方が良いよねってことで生まれたと勝手に思っている
73(1): 2021/02/14(日)05:41 ID:wyKYn9A/(3/6) AAS
>>72
だから、それ（hook）をclassべースで提供できないの？って言ってんの。
74: 2021/02/14(日)05:48 ID:eZAyHvHf(1) AAS
クラスはhookなしで同じことができるから提供する必要がない
75(1): 2021/02/14(日)07:45 ID:o9olz+i9(3/3) AAS
>>73
いやだからsetStateという汎用的な物しか提供できないっことね
stateを自分で好き勝手いじれるのに
それをライブラリが管理するって無理でしょ
hooksは内部で対応するコンポーネントとその状態を管理してるから
ライブラリとして提供できる
76: 2021/02/14(日)13:32 ID:wyKYn9A/(4/6) AAS
>>75
分かんない人だな。
なんで今のclassベースの実装をこの話に持ち込むの。
hookの機能を”function”でなく、jsの”class”で実現できないの？っていう疑問なの。
77: 2021/02/14(日)14:00 ID:+4ZWExbH(1) AAS
お前もわからずやだな
useStateだろうがuseEffectだろうがuseCallbackだろうがuseRefだろうがclassコンポーネントはhookなしで同じことが実現できてるだろ
78: 2021/02/14(日)14:19 ID:wyKYn9A/(5/6) AAS
hookを知らないやつだったか。アホらし。
79(1): 2021/02/14(日)14:34 ID:kA8DCabn(1/2) AAS
時系列的には
クラスコンポーネント: 状態を扱える
↓
"ステートレス"関数コンポーネント: 状態を扱えない
↓
関数コンポーネント+hooks: 状態を扱える
と発展してきた
つまりhooksはクラスコンポーネントができていたことを関数コンポーネントでもできるようにするために後から追加されたもの
ただし
クラスコンポーネント: 状態をコンポーネントが管理する
関数コンポーネント+hooks: 状態をフレームワークが管理する
という違いがある
これが今後のconcurrent modeやserver componentsで大きな違いになってくる
フレームワークができることを増やすにはコンポーネント側の自由度は低い方がよくてそれがpureな関数コンポーネント
80: 2021/02/14(日)14:46 ID:wyKYn9A/(6/6) AAS
>>79
この解説から見ると、自分の疑問は
"状態をフレームワークが管理する"
にはclass実装では不利なのか？向かないのか？
って事になる。ね。
81: 2021/02/14(日)15:15 ID:kA8DCabn(2/2) AAS
クラスコンポーネントのインスタンスはthis.〜で自由に状態を扱えてしまうからフレームワークには都合が悪い
そこをthis禁止のように縛っていくとただの関数でいいやってなる
82: 2021/02/14(日)16:39 ID:DVWK/pJu(1) AAS
useCallbackみたいな単なるラッパー関数がclassにも欲しいってこと？
なんかそう言うパッケージ見たことあるぞ
83: 2021/02/14(日)16:59 ID:FekQTk3J(1) AAS
classコンポーネントにuseCallbackはいらんやろ
前はbindしたり面倒だったけどstage3のclass fields使えばこれだけ
class Foo extends React.Component {
handleClick = (ev) => {...}
84: 2021/02/14(日)21:01 ID:K2VDjDyL(1) AAS
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>
85: 2021/02/14(日)21:03 ID:NOmukaW1(1) AAS
ス・レ・チ
86: 2021/02/15(月)02:51 ID:E7fw/gtI(1) AAS
マジで障害者かな？
この板に巣食ってる人がいるのは認識してたけど
87: 2021/06/18(金)09:52 ID:IQL7BQ/N(1) AAS
React Hooks + Reduxの利点を述べた記事をいくつか読んだのですが、
MVCでだめな理由がよくわかりませんでした。
複数のModelがReduxのStoreに一本化される: Modelをシングルトンにして、
Storeの内部で区分するところをModelのメンバとして区分する。
ViewからはActionを発行してReducerを通さないとStoreを更新できない:
ViewはControllerに登録されたメソッドを通してしかModelを更新できない。
Storeの更新はViewに自動的に反映される。
Model(とそのメンバ、孫メンバ)がObservableであれば、Modelの更新を
自動的にViewに反映させることができる。
ではだめなんでしょうか。
88(1): 2021/08/10(火)10:10 ID:0SSgF6Zh(1/5) AAS
Reactで関数コンポーネントで本気実装始めたんだが、
関数コンポーネント面倒くさ過ぎじゃね？
関数コンポネント入門位の実装なら問題なかったんだが、
ちょっと込み入ったの実装しようと思ったら
クラスじゃないんで、コンポーネントの自前メソッドを（子から親、親から子）公開するのとか
そのTS型定義をどうするのとかうまく解決できんのか？これwww
89(1): 2021/08/10(火)10:18 ID:Yti8n+JL(1) AAS
込み入った実装ってだいたい設計から間違ってるよね…
90: 2021/08/10(火)10:22 ID:0SSgF6Zh(2/5) AAS
>>89
あんたが考えてんの具体的にどのレベルだ？
こっちはネイティブアプリ同等の、ガントチャート状のスケジューラーの実装なんだが
コンポーネント間のメソッド呼び出しは結構多いぞ
91(1): 2021/08/10(火)11:17 ID:x9cqqxVb(1) AAS
奇遇だな、Webとネイティブ両用のスケジュール管理系やってるよ
推測だけどコンポーネントとデータ構造(いわゆるモデル)が分離できてないんだろうと思うわ
同じものをネイティブでも作ることを仮定して共有できるところ(モデル)とできないところ(レンダリング)にわけて考えてみるといんじゃね
92: 2021/08/10(火)11:27 ID:0SSgF6Zh(3/5) AAS
>>91
！！
まだReact不慣れで困ってる
半年前にReact初めてそちはクラスベース（TS）だったので、
実装できない事は無かったのでこういった苦労はなかった
>>コンポーネントとデータ構造(いわゆるモデル)が分離できてないんだろうと思うわ
どうだろう？
あんまり業務的なことを書くわけにはいかんけど、
親パネル側から、配置されたコンポーネントの機能を呼び出したいんだが、
コンポーネントが今回クラスから関数に変わったんで、
コンポーネント側にコンポーネント固有の機能（クラスん時はメソッド）が実装しずらくなって困ってる
関数コンポーネントだとここにメソッドとか置かないもんなの？
93: 2021/08/10(火)12:03 ID:0SSgF6Zh(4/5) AAS
関数なんだから、オブジェクト指向的な実装はムリなんだろうな
とりあえず、
・クラス → モジュール
・プロパティ → モジュールの関数の引数
・メソッド → モジュールの関数
に置き換えて実装してみるわ
上下前次1-新書関写板覧索設栞歴
あと 388 ﾚｽあります
ｽﾚ情報 赤ﾚｽ抽出 画像ﾚｽ抽出 歴の未読ｽﾚ
ぬこの手 ぬこTOP 0.020s