skillup

技術ブログ

JavaScript

vueについてのポイントその2

投稿日:

vueについて少し復習したので、つまりそうなポイントについて再度まとめ。(重複あり)

vueについてのポイント

成果物はこちらを

https://github.com/umanari145/admin_tool

ライフサイクル

create・・DOM生成前

mounted・・DOM生成後

データの初期化などはほぼcreateで良さげ、mountedを使いたいケースは今はなし

変数への代入

コンポーネント内の変数に関して、

this.obj1 = ”などと変数の丸ごと代入をしないこと。おそらくvueのインスタンス生成時に作成された参照を壊してしまい、うまく動かなくなる。

this.obj1.key = ” と値の代入をしっかりと行うこと。

set

vueでオブジェクトのデータバインドがおこらない時に疑う。

vueは配列やオブジェクトのデータバインドがうまくいかないことがあるらしいが、それ以外にもcreateの瞬間と違うタイミングの時に使うなど

v-show,v-if

v-show = display:noneでdomにはかれる。

v-if=DOMにはかれない。

文字列+変数

リテラルで書きたい時。

:idのように:をつけることを忘れない

vuex

コンポーネント内、コンポーネント間のやりとりではどうしても扱いにくい時。グローバル変数的なもの。

-JavaScript
-

執筆者:


comment

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

関連記事

no image

JavaScriptでのオブジェクト指向 クラス作成&インスタンス生成

JavaScriptというと一般的にはjQueryを使って画面の装飾をするスクリプト言語という認識が一般的かと思います。 しかし、JavaScriptでもPHPなどのようにオブジェクト指向的な思想は実 …

no image

npmでのJSライブラリインストール&ビルド(※gulp使用時)

こちらのリンクでJSのnpmパッケージでのインストール&ビルドをしたので、gulpでのビルドを。 前提条件としては nodeのインストール npmのインストール がされていればOKです。 最小構成でい …

no image

ejsのテンプレート

普段生のHTMLを書く機会はほとんどなく、画面側の仕事でもフレームワークを使うことがほとんどなので搭載されているテンプレートを使っています。 で、生のHTML/CSSの本を読んでいてejsなるテンプレ …

no image

AngularJSでのinfite_scroll

今回もAngularネタです。 一般的なデータの一覧画面ではページャーをボタンで移動するのではなく、スクロールするだけで次々とアクセスできるようになるのが一般的でしょう。 facebookやtwitt …

no image

vueでの配列、オブジェクトの反映に関して

vueでのハマりポイントですが、関門としては コンポーネント間の連携 オブジェクトや配列となった時に反映がされない などがあげられると思います。 コンポーネント間の連携に関してはこちらの記事でも書き、 …

アーカイブ