表示調整
閉じる
挿絵表示切替ボタン
▼配色
▼行間
▼文字サイズ
▼メニューバー
×閉じる

ブックマークに追加しました

設定
0/400
設定を保存しました
エラーが発生しました
※文字以内
ブックマークを解除しました。

エラーが発生しました。

エラーの原因がわからない場合はヘルプセンターをご確認ください。

150/210

RxJSとはなんぞや?⑥ サイコロ連打の記録に挑戦②

前回は、fromEventによるチェンジイベントの発生の監視がうまく行かない所で終了です。


具体的には


"home.page.html"に


<ion-checkbox id="idStop" [(ngModel)] = "flgStop"></ion-checkbox>


と言うチェックボックスを追加し、これのオンオフを監視しようとした訳です。


おさらいですが、有るエレメント上のマウスの動きをイベントとしてとらえた場合の"Observable"を作成した場合のコードは


const mouseMoves = fromEvent<MouseEvent>(el, 'mousemove');


と言う感じです。


上のコードの<MouseEvent>と'mousemove'をどう変えるかと言う問題でしたが、VisualStudioCodeの機能『型定義に移動』で<MouseEvent>の型定義場所"C:\Users\ユーザー名\AppData\Local\Programs\Microsoft VS Code\resources\app\extensions\node_modules\typescript\lib\lib.dom.d.ts"を発見。


同じファイルに'mousemove'の定義場所(?)も見つけました。


そこから(他の記述の内容から推測して)チェックボックスのオンオフを監視するObservableを以下のように作成する事で機能はしました。


const StopDice = fromEvent<MouseEvent>(el, 'mouseup');


このファイルはタイプスクリプトの宣言一覧的な代物の様で、


『typescript globaleventhandlerseventmap 使い方』で検索した結果の


TypeScript Deep Dive 日本語版 | lib.d.ts

https://typescript-jp.gitbook.io/deep-dive/type-system/lib.d.ts


にある程度情報載っていました。


ただ欲しいのは<MouseEvent>じゃなく<Event>の'change'なんですが、こちらがどうもうまく行かない。


今更ですが、TypeScriptもRxJSもビギナーに優しくないですね。


明日、また挑戦します。投稿

評価をするにはログインしてください。
この作品をシェア
Twitter LINEで送る
ブックマークに追加
ブックマーク機能を使うにはログインしてください。
― 新着の感想 ―
このエピソードに感想はまだ書かれていません。
感想一覧
+注意+

特に記載なき場合、掲載されている作品はすべてフィクションであり実在の人物・団体等とは一切関係ありません。
特に記載なき場合、掲載されている作品の著作権は作者にあります(一部作品除く)。
作者以外の方による作品の引用を超える無断転載は禁止しており、行った場合、著作権法の違反となります。

この作品はリンクフリーです。ご自由にリンク(紹介)してください。
この作品はスマートフォン対応です。スマートフォンかパソコンかを自動で判別し、適切なページを表示します。

↑ページトップへ