[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。
こちら：https://hiyo-hitsu.sakura.ne.jp/InternalChat/。BCDice を振れたりする。
前にも似たようなものを書いたがクイックレスポンス機能は案外使わなかったので外した。また、レスを飛ばす機能もあまり使わなかったので外した。ダイスを振る機能は bcdice-api をやめて bcdice として埋め込んだ。また、ログを保存する機能を付けた。
模擬戦をやったり、議事録をとったりするのに使えるかなーとか思っている。
以下のようなコードについてもうちょっと上手く書けないか？という話を頂いた。
const searchTargetArray = ['ぱんだ', 'うさぎ', 'こあら'];
const searchQuery = 'こあら';
let flag = false;
for(var i = 0; i < searchTargetArray.length; i++) {
if( searchTargetArray[i] === searchQuery ) {
flag = true;
}
}
if( flag ) {
console.log('みつかりました！');
} else {
console.log('みつかりませんでした');
}
これは JavaScript の配列ならば includes 関数で一発でやれる。
const searchTargetArray = ['ぱんだ', 'うさぎ', 'こあら'];
const searchQuery = 'こあら';
if( searchTargetArray.includes(searchQuery )) {
console.log('みつかりました！');
} else {
console.log('みつかりませんでした');
}
この手の便利関数について、ちゃんとしたまとめは MDN の記事を読んだほうが良いが、サラッと一通り追うならば JavaScript Array操作 15本ほど - Qiitaが便利だった。
個人的には forEach と map、filter は抑えておくと楽だと思っている。
しばしば書くのだが、書くたびに手書きしていて面倒だったのでメモ。
const convertDateToMyFormat = (date = new Date()) => {
return `${date.getFullYear()}/${String(date.getMonth() + 1).padStart(2, '0')}/${String(date.getDate()).padStart(2, '0')} ${String(date.getHours()).padStart(2, '0')}:${String(date.getMinutes()).padStart(2, '0')}:${String(date.getSeconds()).padStart(2, '0')}`;
};
convertDateToMyFormat(new Date(597968970000)); // 1988/12/13 07:29:30
react-sortablejs の MultiDrag と Swap のサンプルを試していたら Uncaught TypeError: MultiDrag is not a constructor と怒られた。すなわち、以下のコードである。react-sortablejs は 6.0.0 を使用。
import React from "react";
import { ReactSortable, Sortable, MultiDrag, Swap } from "react-sortablejs";
// mount whatever plugins you'd like to. These are the only current options.
Sortable.mount(new MultiDrag(), new Swap());
const App = () => {
const [state, setState] = useState([
{ id: 1, name: "shrek" },
{ id: 2, name: "fiona" },
]);
return (
<ReactSortable
multiDrag // enables mutidrag
// OR
swap // enables swap
>
{state.map((item) => (
<div key={item.id}>{item.name}</div>
))}
</ReactSortable>
);
};
同様の問題にあたった人がいたようで Issue ([bug] ReactSortable MultiDrag/Swap is not a constructor #143) が書かれている。また、そこには解決策も紹介されており、最上部の import を次のように書き換えたら上手くいったとのことであった。つまり、 MultiDrag や Swap は sortablejs から読み込むのである。
import { ReactSortable } from "react-sortablejs";
import { Sortable, MultiDrag, Swap} from "sortablejs";
これは実際私の手元でも上手く動いた。