Ken428965 2022-10-19 17:48 采纳率: 53.6%
浏览 174
已结题

react,浏览器没有报错,刷新页面后数据丢失的问题?

在使用的react版本如下:

img


已写的代码:

import React from 'react'
import { IndexBar, List } from 'antd-mobile';
import axios from 'axios';
import NavHeader from '../../components/NavHeader';
import './style.css';
const charCodeOfA = 'A'.charCodeAt(0);
let groups = Array(26)
    .fill('')
    .map((_, i) => ({
    title: String.fromCharCode(charCodeOfA + i),
    items: []
}))

  let cityList = []
  const res = axios.get(`http://localhost:8080/area/city?level=1`).then(res=>{
    cityList = res.data.body
    groups.map((item)=>{
      cityList.map((city)=>{
      if(city.pinyin.slice(0,1).toUpperCase()==item.title){
        item.items.push(city)}
      })
    })
  })
export default () => {
        return (
        <div className='citylist'>
        {/* 顶部导航栏 */}
        <NavHeader>城市选择</NavHeader>
          {/* IndexBar序列 */}
  <div className='indexbar' style={{ height: window.innerHeight - 45 }}>
  <IndexBar>
        {groups.map(group => {
            const { title, items } = group;
            return (<IndexBar.Panel index={title} title={`${title}`} key={`${title}`}>
              <List>
                {items.map((item, index) => (<List.Item key={index}>{item.label}</List.Item>))}
              </List>
            </IndexBar.Panel>);
        })}
      </IndexBar>
      </div>
  </div>
        )
}

在代码写完后,浏览器页面可以获取到城市数据:

img


但在刷新页面后数据丢失了:

img


请问刷新页面后数据丢失的原因是什么?如何修改代码?

  • 写回答

2条回答 默认 最新

  • 崽崽的谷雨 2022-10-19 18:32
    关注

    我在以前的问题回复你了你瞅瞅 。需要转换成 hook写法

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 已结题 (查看结题原因) 10月20日
  • 已采纳回答 10月20日
  • 创建了问题 10月19日

悬赏问题

  • ¥20 请问,这个视频播放软件的名称
  • ¥15 运筹优化,gurobi,python
  • ¥20 画CAD几张图片内容如下1111111111111111111111111111111111111111111
  • ¥15 基于python的电影系统推荐
  • ¥20 springmvc重定向和返回json
  • ¥15 数学建模——参会安排怎么做
  • ¥15 电脑键盘实现触摸功能
  • ¥25 matlab无法将表达式转换为双数组怎么解决?
  • ¥15 单片机汇编语言相关程序
  • ¥20 家用射频美容仪技术规格