はじめに
Vuex の状態を robinvdvleuten/vuex-persistedstate で localStorage
などに永続化する方法。
TL;DR
npm i vuex-persistedstate
でインストールplugins
で設定するだけで OKlocalStorage
以外を使いたい場合はstorage
オプションで設定sessionStorage
,Cookie
,localStorage
+ 暗号化, etc
Vuex の状態を robinvdvleuten/vuex-persistedstate で localStorage
などに永続化する方法。
npm i vuex-persistedstate
でインストールplugins
で設定するだけで OKlocalStorage
以外を使いたい場合は storage
オプションで設定sessionStorage
, Cookie
, localStorage
+ 暗号化, etc「Vue.js で○○を実現するライブラリを探したい」というときは Awesome Vue.js を使うと便利、というだけの話。
リポジトリは vuejs/awesome-vue。
公式ページ上でも、GitHub(リポジトリ トップ) 上でも情報を探せるようになっている。
GitHub 上で見る場合は、スクロールバーのサイズ(ページの長さ)や目次のデカさを見て探す気が失せるかもしれないが、目次の「Components & Libraries」を見て自分の見たい箇所だけチェックするという使い方で OK。
もしくは 「Ctrl(Cmd) + F」 で探すとかでも良いと思う。
あとは各ライブラリのリポジトリで詳細を確認し、自分のプロジェクトにマッチするかどうか、スター数、コミット頻度(放置されてないか)などで、どれを使うかを判断すれば良い。
わかりにくいけど公式ドキュメントにも awesome-vue へのリンクはある。(自分は Google 検索から、たまたま awesome-vue にたどり着いた)
プラグインの使用 の下記
コミュニティの貢献による膨大なプラグインやライブラリは awesome-vue で確認できます。
Using a Plugin の下記
Checkout awesome-vue for a huge collection of community-contributed plugins and libraries.
もしくは
エコシステムを調べる の下記
The Awesome Vue Page: 他の素晴らしい人々によって公開された素晴らしいリソースを参照します。
The Awesome Vue Page: See what other awesome resources have been published by other awesome people.
Vue.js で PeachScript/vue-infinite-loading を使った無限スクロール(Infinite Scroll)の実装方法。
npm i vue-infinite-loading
でインストール<infinite-loading @infinite="infiniteHandler" />
を記述infinite
イベントのハンドラ内でデータの追加や、読み込み完了などの処理を実施Twitter の埋め込みツイート(Embed tweet)を Lazy load させる方法
blockquote
, script
)を 作成/追加min-height
などを設定しておくNode.js で semver 形式のバージョンを比較する方法。
Semantic Versioning 2.0.0 | Semantic Versioning
compareVersions(<ver_a>, <ver_b>)
で比較ver_a > ver_b
なら 1
(例: 1.1.2 > 1.1
)ver_a = ver_b
なら 0
(例: 1.1.0 = 1.1
)ver_a < ver_b
なら -1
(例: 1.1.0 < 1.1.2
)compareVersions.compare('10.0.1', '10.0.1', '>')
とすると true/false
で返却NativeScript でアプリのバージョン情報などを取得する方法。
getAppIdSync()
: com.hoge.fuga
などgetVersionNameSync()
: 1.0
などgetVersionCodeSync()
: 1.0.1
(iOS), 10001
(Android) などwebpack で Moment.js の不要な Locale を除去する方法。
webpack.config.js
の plugins
に以下を追加new MomentLocalesPlugin({ localesToKeep: ["ja"] })
NativeScript でデバイスの輝度(明るさ)を制御する方法。
brightness.set({ intensity: <value> })
で輝度設定(0(暗) <-> 100(明))brightness.get()
で現在の輝度取得suspendEvent
などPage
や xxxxLayout
などの load
や unload
イベント