JavaScript

【Vue.js】Vuex~store.jsを分割する~

vuexについての記事はこちら↓ 機能ごとにコードを分割 store.jsは大規模な開発になると肥大化するため、用途ごとにパーツ分けをすると保守運用が効率的になる。 まず、src直下にstoreフォルダを作成し、storeフォルダの直下にm...
JavaScript

【Vue.js】Devtoolsのインストール

googleの拡張機能にvueのdevtoolが無償提供されている。 google vuedevtoolはこちら インストールした後に、F12(google devtool)を開くと、ElementsやConsole、Networkの並びに...
JavaScript

【Vue.js】Vuexを使ってみる~アクセッサーとv-model使って値のやり取りを行う~

vuexのインストール方法はこちら↓ vuexの使い方についてはこちら↓ v-modelをvuexで使う 入力した値を取得&置き換えるときには、getterとsetterをcomputedの中で使用して、v-modelで双方向データバインデ...
JavaScript

【Vue.js】Vuexを使ってみる

インストール方法の記事はこちら↓ getters 計算式など複雑な式を含む関数をコンポーネントで使いまわしたい時、gettersを使用すると効率的になる。 store.jsに計算式を作成。gettersの中では、stateで定義したcoun...
JavaScript

【Vue.js】Vuexインストール方法

大規模な開発に向いている状態管理パターンとライブラリ。 下記コマンドを実行 npm install vuex src直下にstore.jsを作成。importで読み込む。 state:はvue全体で使用できるグローバル変数。 main.js...
JavaScript

【Vue.js】Routerでルーティングする~その3~

前回までの記事はこちら↓ グローバルビフォーガード 全てのページ遷移前に特定の処理を施すことが可能。main.jsでimportしたrouter.jsに.beforeEachを使って、実装を行う。 .beforeEach には3つの引数を取...
HTML/CSS

wordpressにInstagramを埋め込みしても画像が表示されない時の対処法

wordpress記事にインスタを埋め込みしても画像が表示されない時の対処法です。個人的にこのような現象に遭遇したので、対処の方法をメモします。 <前提>・投稿はadmin権限で行っている = scriptタグが強制的に消える事はない・イン...
JavaScript

【Vue.js】Routerでルーティングする~その2~

前回の記事はこちら↓ 固定されたレイアウトを作る viewに名前を付けて、固定レイアウトを作ることができる。 どのパスでアクセスされても同じレイアウトを出すためには、パスのcomponentを・複数形にする・オブジェクトにすることで、固定レ...
JavaScript

【Vue.js】Routerでルーティングする

Routerとは、Vueが用意しているプラグインで、URLとプロジェクトを関連付ける役割をするもの。これによって大規模SPAなどが作れる。 Routerプラグインのセットアップ CLIで、下記のコマンドを実行してRouterプラグインをイン...
プログラミング

Visual Studio Codeでディレクトリ構造を表示する

よくブログで見かけるツリー構造を自動的に表示させるコマンドをご紹介します。今まで、手で書くとばかり思っていたので、超便利です! パス直下のディレクトリ(フォルダ)構造を表示する tree PS C:\Users> tree ファイル名も表示...