Nuxt.js

vue-slick-carouselの使い方 レスポンシブ対応などオプションの書き方

vue-slick-carouselとは カルーセルで大人気のプラグイン、slick.js。 そのVue版の1つがvue-slick-carouselです。 Nuxt.jsでももちろん使えます。 install npm...
ES6

結局JSのスプレット演算子(…)って何なの?

結局スプレット演算子って何なのかを書いていきます。 スプレット演算子とは スプレッド構文 (...) を使うと、配列式や文字列などの反復可能オブジェクトを、 0 個以上の引数 (関数呼び出しの場合) や要素 (配列リテラルの場...
compositionApi

Nuxt composition-Apiのrouterの書き方【useRoute, useRouter】

composition-Apiにおけるthis.$route と this.$router の書き方を解説します。 動きとしては同等です。 import { computed, defineComponent, useRoute...
compositionApi

nuxt自作プラグインの作り方

nuxtの自作プラグインとは nuxtの自作プラグインとはつまり関数を共通化することです。 contextとinjectを利用することでどのファイルからも呼び出し可能です。 nuxtで自作プラグインを作る方法 nuxtで自作プラ...
Vue.js

Vueでclassを動的に切り替えたい【複数、三項演算子】

動的に反応させることをVueではディレクティブと言います。 classのディレクティブの書き方は以下です。 <div :class="{'is-active': isActive}"></div> ...
Nuxt.js

nuxt.config.jsに書くこととは

export default { ssr: false, // Global page headers: head: { title: '', htmlAttrs: { lang: 'ja', }, m...
TypeScript

Vue.jsで複数のトグルを作成する方法(compositionApi,TypeScript)

Vue.jsでトグルを作るのは簡単です。 ただ複数のトグルとなると話は変わってきます。 考え方から書くと配列を作ってその値を判断して閉じる開くをスイッチします。 template <ul> ...
ES6

JavaScriptのES6でよく使う構文一覧

定義 const apple = 'りんご' let orange = 'みかん' constは定数、letは変更可能な変数です。 基本的にはconst、上書きしたいときはletを使います。 アロー関数 le...
タイトルとURLをコピーしました