必要に駆られて夜な夜な急遽作ったのですがせっかくなので置いておきます。 props でタイマーのON/OFFをセットするよ。 <CountUpTimer :on-start="isStarted" /> <template> <div class="count-up-timer"> <div class="time"> {{ time }} </div> </div> </template> <script> export default { name: 'CountUpTimer', props: { onStart: { type: Boolean, requ…</countuptimer>

axiosでAPIにアクセスするとき、エラーレスポンスをハンドリングすることは出来るんだけど、接続エラーなどの、サーバーからレスポンスが何も帰ってこないエラー(ネットワークエラー)は onError にも onResponse にも入ってこない。 // @/plugins/axios.js e…

Vue.js 開発環境で、chromeアップデートしたら Unchecked runtime.lastError: The message port closed before a response was received. がコンソールに出るようになった。 ぐぐると拡張機能のどれかが影響して出ているらしい。 でも、環境によって犯人が異…

なぜかうまくいかず時間がかかったのでメモ こういうページネーションのコンポーネントのテストを書くとき、 コンポーネントのpropsには以下のような値(現在のページ,ページあたりの件数,トータル件数)を設定できるとして <Pagination :config="{ current: 1, limit: 20, total: 100 }" @movePage="load" /> propsに値を設定したことを受け、w</pagination>…

よくあるSPAのドロップダウン。 ドロップダウンだ <n-link class="navbar-link" to="/members"> <span class="icon is-medium"> <i class="fas fa-lg fa-user"></i> </span> <span>メンバー管理</span> </n-link> <div class="navbar-dropdown"> <n-link class="navbar-item" to="/members">メンバー一覧</n-link> </div>

こういうやつ // NG watch: { config: (val, oldVal) => { console.log(val) console.log(oldVal) } } functionにする必要があります。 // OK watch: { config: function(val, oldVal) { // functionにする console.log(val) console.log(oldVal) } } ウォッ…

Vueコンポーネントの中で自身のコンポーネントを呼び出してツリー表示をしたいときがあると思います。 今回やりたかったのは以下のこと。 1) 初期表示で最上位の階層(親のいない階層)を表示 2) 子要素があれば hasChild 属性が true。「＋」ボタンを表示する…

storeの中に new Vuex.Store を返す index.js を作成したらエラー ファイル名を store/index.js から store/store.js に変えたら直った。 store/index.js はNuxtの中では特別な意味があるファイルなのか。 ja.nuxtjs.org

直したいこと サンプルで入ってるvueファイルにVSCodeのフォーマッターをかけただけで怒涛のエラー⚡️ 解決策 Vetur というプラグインを入れて VSCodeの設定ファイル settings.json に以下の1行を追記したら治ります //settings.json { "vetur.format.default…