グローバルコンポーネント See the Pen xvEygO by りっしー (@hiwriterprogram) on CodePen. グローバルコンポーネントは全てのVueインスタンスで使用可能 ローカルコンポーネント See the Pen eqdPEm by りっしー (@hiwriterprogram) on CodePen. ローカル…

以前、refsを使ってDOMを直接参照するという記事を書きましたが、今回はその応用です。 refsを参照する場合、仮想DOMではなく実体のDOMを参照するため、データ反映が遅いという現象が起きてしまいました。すぐさま値を知りたい場合、本来はリアクティブな仮…

フィルタとは、文字数を丸めたり数字にカンマを入れるといったテキストベースの変換処理に特化した機能です。フィルタはローカルまたはグローバルに登録して使用しますが、注意点としてローカルに登録した場合でもthisへのアクセスはできません。引用元：基…

See the Pen watchでGitリポジトリ検索 by りっしー (@hiwriterprogram) on CodePen. 選択肢（dataのtopics）を増やせばさらに検索の幅が広がります。 検索についてはJS側の方はほぼ定型のようなものなので色々なものに応用できそう。 参考 基礎から学ぶ Vue…

算出プロパティは、dataが変化するたびに作動してくれるメソッドです。 そのためv-modelでdataの各項目と結びつきのあるinputを作れば、簡単に計算などをすることができます。 See the Pen NQRveM by りっしー (@hiwriterprogram) on CodePen. 参考 基礎から…

インラインメソッドハンドラ See the Pen インラインメソッドハンドラ by りっしー (@hiwriterprogram) on CodePen. HTMLのタグ内にてv-onのmethodsを書いてしまうというもの。 短いメソッドや1度しか使わないメソッドであれば使ってもよいですが、長いメソ…

v-pre See the Pen v-preの使い方 by りっしー (@hiwriterprogram) on CodePen. v-preは、{{}}で囲ったdataの値があっても変換をしません。 そのため静的なコンテンツとして扱われます。 v-once See the Pen v-onceの使い方 by りっしー (@hiwriterprogram) …