React

めっちゃ簡単にReactでローカルストレージを使う方法

Webサイト制作に関する専門的な記事です。

ReactでTodo list(自分で作ったやつです！)を作ったりした際にウェブサイトリロード時にもデータを保持できるようにしたい場合があるかと思います。

今回はものすごく簡単にローカルストレージを実装できる方法を見つけたので紹介したいと思います。

使うコンポーネントはReact Simple Storageです！

使い方としては、yarn add react-simple-storageでインストールしてApp.js上部で
import SimpleStorage from "react-simple-storage";
しておきます。
あとはApp.jsのrender内で
render() {
    return (
      <div className="App">
     
        {/* ローカルストレージの実装 */}
        <SimpleStorage parent={this} />
      
のように記述するだけでローカルストレージが実装されます。

ぜひ試してみてください！