Vue.jsで同一ページでパラメーターが変更されたことを検知する
ページ内でタブを使用している。 タブの内容に対してパラメータを用いて直接アクセスしたいという依頼を受けた。 例）http://hogehoge.com/list?tab=2 仕様： ・例のようにURLにタブを指定するNo（タブの幾つめか）が含まれていればそのアクセス時にそのタブを表示 ・タブ遷移時にはURLパラメータを更新してユーザーがパラメータ付きURLをコピーできるようにする —& […]
vue.js
vue.jsでスライダーを導入する
htmlで実装していたページをvue.js形式で作り直すことになった。 その際にスライダーを導入する必要があったため下記の対応を行った。 １、VueAwesomeSwiperを追加 ◯yarnでのインストール yarn add vue-awesome-swiper ◯npmでのインストール npm install vue-awesome-swiper ２、main.jsへの記述追加 // Swip […]
Vue.jsでのスクロール感知
スクロール位置を判定したパーツの表示に利用。 下記ソースではスクロール値が200pxに達すると、divに対して「isVue」クラスを付与。 handleScroll()でwindow.scrollYを指定すると、横スクロールが取得できる。 ◆hrml <div v-bind:class="{ isView: isView }"> ◆vue new Vue({ el: '#app', d […]
vue.jsでbuttonのdisabledを切り替える
■html <div id="app"> <button href="#" class="btn btn-info" v-on:click="button_disable()" :disabled="isTestDisabled">Disable_Button</button> </div> ■script <script> var vm […]