LocalStorage enregistré dans le composant React sera-t-il mis à jour lorsque le composant est mis à jour ?

Question

Est-il normal que la valeur de pagecount1 qui enregistre localStorage dans le composant React change après avoir cliqué ? Veuillez l'analyser.

Le code source est le suivant :

import React, { Component } from 'react'
import ReactDom from 'react-dom'
import Style from './main.css'


export default class LikeButton extends Component {
  constructor() {
    super();
    this.state = {
      liked: false
    };
  }
  
  handleClick() {
    this.setState({liked: !this.state.liked});
  }

  render() {
    const text = this.state.liked ? 'liked' : 'haven\'t liked';
    const style = this.state.liked ? { background: '#8aa'} : {};
    localStorage.pagecount1 = localStorage.pagecount1 ? Number(localStorage.pagecount1) + 1 : 1;

    return (
      <p className={Style.box}>
        <p style={style} className={Style.btn} onClick={this.handleClick.bind(this)} title={'Click to toggle'}>
          You {text} button.
        </p>
        <p> "访问页面次数:{localStorage.pagecount1}次"</p>
      </p>
    );
  }
}

Answer 1

Tout d'abord, il ne s'agit pas du nombre de visites de pages, mais du nombre de rendus de composants.
Deuxièmement, localStorage est stocké localement,
Cela n'a rien à voir avec le composant (lié à l'affectation),
Cela n'a pas d'importance. si le composant est détruit ou si le navigateur est fermé, tant que le navigateur n'efface pas les données de navigation, elles seront toujours là.

Portail : utilisé par localStorage