問(wèn)題描述

react組件中保存了localStorage的pagecount1的值點(diǎn)擊后會(huì)改變是正常的嗎？請(qǐng)大神分析一下。

源碼如下：

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> '訪問(wèn)頁(yè)面次數(shù):{localStorage.pagecount1}次'</p> </p> ); }}

問(wèn)題解答

首先你這個(gè)不是訪問(wèn)頁(yè)面次數(shù), 是組件渲染的次數(shù).其次localStorage是存入了本地, 與組件已經(jīng)無(wú)關(guān)了(賦值有關(guān)), 組件銷(xiāo)毀關(guān)閉瀏覽器都沒(méi)關(guān)系, 只要不清瀏覽器的瀏覽數(shù)據(jù), 就永遠(yuǎn)存在.

傳送門(mén) : localStorage使用