JavaScript

JavaScript

【IE11】JavaScriptのfor文内でaddEventListenerを使うとインデックス番号が狂う件について

どれだけ技術が発展しても、いまだに足を引っ張り続ける問題児、IE11。 なんと2021年現在、そのシェアは国内で第4位なんだとか。 そんなIE11に今回も悩まされました。 起こったこと for (let i = 0; i &...
JavaScript

npm scriptでディレクトリごとコピーする方法【fs-extra】

npmで、あるファイル(ディレクトリ)を特定の場所にコピーする方法です。 使用するもの こちらをインストールしてください。 $ npm i fs-extra package.json 必要な部分のみ抜粋します。 // 以...
JavaScript

【Edge対応】スクロールの開始位置を常に一番下に設定する方法

こんにちは。 スクロールの開始位置を常に一番下に設定したい場合ってありますよね。 例えば、ラインのようなメッセージのやり取りができるプラットフォームを作る場合、 常に一番下に最新メッセージを表示させたい、とか。 そういった場...
JavaScript

vue.jsで子から親コンポーネントにデータを渡す方法

こんにちは。 vue.jsで、子コンポーネントから親コンポーネントにデータを渡す方法があれば便利ですよね。 調べてみると、$emitというメソッドを使うと簡単にできるようなので、今回はその方法を紹介します。 vue.jsで子から親...
JavaScript

Vue.jsで配列・オブジェクトの変更がv-ifなどで検出できない場合の解決方法

Vue.jsで配列・オブジェクトを扱う場合、配列のデータは更新されているのに変更が検出できない、という現象でつまったので書きます。 僕がつまったケース mountedで配列に値をセットし、その後あるメソッドを実行した場合に変...
iziModal

iziModalにツイッターを埋め込む方法

こんにちは。 iziModalにツイッターを埋め込むと、モーダルウィンドウを開いた際に埋め込みタグがそのまま表示されてしまうという現象に悩んでいませんか? 本記事では、上記の原因と解決方法を紹介します。 iziModalにツイ...
JavaScript

iPhoneのスクロール時にバウンス効果を無くす方法【iNoBounce使用】

こんにちは。 iPhoneやiPadなどのiOS端末で、一番上、または一番下までスクロールすると画面がボヨーンとバウンドする「バウンス効果」。 一見するとおしゃれな効果ではありますが、出てほしくない場面もありますよね。 本記事...
FileSaver

JSだけで複数のbase64データを画像化しZIPでダウンロード

こんにちは。 今回は、複数のbase64データを画像化して、ZIPで圧縮してダウンロードする機能を実装します。 まず使うライブラリは以下2つです。 JSZip FileSaver JSzipを読み込む 公...
JavaScript

Vue.jsで「?」から始まるURLのクエリパラメータを設定・取得する方法

こんにちは。 Vue.jsで開発をしていて、URLのクエリパラメータで情報を送りたいと思ったことはありませんか? この記事では、Vue.jsで「?」から始まるURLのクエリパラメータを設定・取得する方法について解説します。 ※...
JavaScript

Vue.jsのwatchで連想配列が監視できない場合の解決法

こんにちは、macoです。 Vue.jsの値の変更を監視できるwatch機能はすごく便利ですが、連想配列で値を変更した場合にうまく動作しなかったので、解決方法を解説します。 連想配列でwatchが動かない例 watchではuser...