Vue.js

Vue.js の開発メモ

※ WIPです。

理解のための言語化

Vuex

  • Vuex とは、Vue.js のために開発された状態管理ライブラリ
  • 状態管理をすることで、コンポーネントをまたいでデータの受け渡しをしやすくできる
  • 親 と 子 での値受け渡しで管理するのではなく、状態遷移の仕組みを構築して一括管理する

勉強に役立つサイト

Vue.js

Vue Router

Vuex

スタイルガイド

  • 公式ガイドが参考になる
  • 以下、迷ったところの判断メモ

ファイル名は パスカルケース or ケバブケース

それぞれのメリデメは下記だが、grepのしやすさを考えるとパスカルケースが良さそう

  • パスカルケース (PascalCase)
    • コンポーネントを参照する方法と一致しているので、コードエディタ上でオートコンプリートが可能な場合はとてもうまく働く
    • 大文字と小文字が混ざったファイル名は、大文字と小文字を区別しないファイルシステム上で時々問題を起こす可能性がある
  • ケバブケース (kebab-case)
    • 大文字、小文字を区別しないファイルシステムでも問題なく動く

コンポーネントの参照もパスカルケースにする場合は、以下の点にも気をつける必要がある

  • DOM 内 (すなわち、文字列でないテンプレート) に直接使用する場合には、ケバブケースの名前のみが有効なのに注意する
    • つまり、Rails等のViewではパスカルケースは使えないことに注意する
  • 詳細は、コンポーネントの命名ケース

COMMENT

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です