JavaScript– tag –
-
SWRのuseSWRInfinite()を使って無限スクロールを実装する
この記事ではSWRのuseSWRInfinite()を使って無限スクロールの実装方法をサンプルコードを使ってご紹介します。 サンプルコードのデモは次の通りです。 このデモの仕様は データは2件づつ取得一番下の「読み込み中」が表示されたのをトリガーとして次のデー... -
SWRのuseSWRInfinite()を使って「もっと見る」機能の実装
この記事ではSWRのuseSWRInfinite()を使って「もっと見る」機能の実装方法をサンプルコードを使ってご紹介します。 サンプルコードのデモは次の通りです。 このデモの仕様は 1ページ目から取得1ページあたり2枚の写真ボタンをクリックすると次のページの写... -
テキスト内のURLのプレビューを表示する
この記事ではテキスト内にあるツイッターのURLやyoutubeのURLをもとにプレビューを表示する方法をサンプルコード付きでご紹介します。 サンプルコードのデモは次の通りです。 デモではテキストエリアに入力されたツイッターのURLやyoutubeのURLを1つづつ表... -
テキスト内のハッシュタグやURLをリンクにする
この記事ではコメントなどのテキスト内の任意の文字列をリンクに変換する方法をサンプルコード付きでご紹介します。テキスト内の任意の文字列とは具体的に URLハッシュタグ（#hogehoge）メンション（@hogehoge） です。これらの文字列をテキストリンクする... -
Uploading multiple images using react.
In this article, we will show you how to select and upload multiple images in react. In the sample code shown later, we will use the material UI v5axiostypescript in the sample code I will show later. This sample code assumes a form wher... -
reactで複数の画像をアップロードする
この記事ではreactで複数の画像を選択してアップロードする方法をご紹介します。 後でご紹介するサンプルコードでは material UI v5axiostypescript を使用しています。 ご紹介するサンプルコードはコメントに画像を付けて投稿するフォームを想定していま... -
material-tableのexportCsvを使って出力をカスタマイズする
この記事ではmaterial-tableのexportCsvを使って出力するCSVをカスタマイズする方法をご紹介します。 exportCsvは出力するCSVの内容を変更できるオプションプロパティです。 Function to create a custom CSV fileカスタムCSVファイルを作成する機能https:... -
Cannot invoke an object which is possibly ‘undefined’.
In this article, I will show you how to solve the problem of "Cannot invoke an object which is possibly 'undefined'. In this article, I will show you how to solve the problem when you get the error "Cannot invoke an object which is possi... -
Cannot invoke an object which is possibly ‘undefined’.
この記事ではtypescriptで「Cannot invoke an object which is possibly 'undefined'.」というエラーが出たときの解決方法をご紹介します。 このエラーが出る型定義は以下の通りです。 export type ButtonProps = { ... handleOnClick?: () => void; };... -
[Next.js] Using axios to get data with SWR
I will show you how to use axios to get data in Next.js SWR. The API server is assumed to be Laravel.We also assume that Laravel is using Eloquent's API Resources when returning data. https://laravel.com/docs/8.x/eloquent-resources So, w...
