摘要：
import React from 'react' import axios from 'axios' //留白 import { Carousel, Flex, Grid, WingBlank } from 'antd-mobile' import Nav1 from '../../assets/ 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(21)
评论(0)
推荐(0)
摘要：
1实现结构和样式 2实现城市选择 搜索 地图找房页面的路由跳转 import React from 'react' import axios from 'axios' //留白 import { Carousel, Flex, Grid, WingBlank } from 'antd-mobile' 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(33)
评论(0)
推荐(0)
摘要：
根据当前地理位置,获取当前所在城市的房源信息 H5中的地理位置api 获取地理位置api 地理位置通过nevigater.geolocation获得 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(33)
评论(0)
推荐(0)
摘要：
1H5的地理位置只能获取经纬度信息 2实际开发过程中使用高德地图api或者百度地图api实现 3通过api可以实现页面的使用 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(36)
评论(0)
推荐(0)
摘要：
1注册百度账号 2点击创建应用 3获取到密钥 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(68)
评论(0)
推荐(0)
摘要：
1使用步骤 1映入百度地图中的api文件 2在index.css中设置全局样式 创建Map组件 配置路由 并在map组件中 创建地图容器元素 并设置样式 import React from 'react' // 导入样式 import './index.scss' export default cl 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(82)
评论(0)
推荐(0)
摘要：
获取顶部导航城市信息 1打开百度地图api文档 2通过ip定位获取当前城市名称 3调用我们服务器的接口 换取项目中的城市信息 import React from 'react' import axios from 'axios' //留白 import { Carousel, Flex, Grid, 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(51)
评论(0)
推荐(0)
摘要：
1打开ant design moblie导航栏的文档 2从文档中拷贝示例代码进入页面开始学习 import React from 'react' //导入navBar组件 import { NavBar, Icon } from 'antd-mobile' import "./index.scss" 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(37)
评论(0)
推荐(0)
摘要：
业务分析:切换城市 查看该城市下的房源信息 功能 顶部导航栏 城市列表展示 使用索引快速切换城市 点击城市名称切换城市 react-virtual长列表转换 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(32)
评论(0)
推荐(0)
摘要：
1获取步骤 import React from 'react' import axios from "axios" //导入axios //导入navBar组件 import { NavBar, Icon } from 'antd-mobile' import "./index.scss" clas 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(35)
评论(0)
推荐(0)
摘要：
1页面加载时 根据接口获取列表数据 2分析当前数据格式以及改功能需要的数据格式 3渲染数据 import React from 'react' import axios from 'axios' //导入axios //导入navBar组件 import { NavBar, Icon } from 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(84)
评论(0)
推荐(0)
摘要：
import React from 'react' import axios from 'axios' //导入axios //导入navBar组件 import { NavBar, Icon } from 'antd-mobile' import './index.scss' // 数据格式化的方 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(42)
评论(0)
推荐(0)
摘要：
阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(21)
评论(0)
推荐(0)
摘要：
1可视区域渲染（react-virtualized） 2适用于一次性展示大量的数据 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(44)
评论(0)
推荐(0)
摘要：
阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(21)
评论(0)
推荐(0)
摘要：
1让list组件占满屏幕 2导入AutoSizer组件 3通过render-props模式 获取到AutoSizer组件暴露的width和height属性 4设置List组件的width和height属性 5设置城市根元素高度100% 让组件占满整个页面 6调整样式 不要出现全局滚动条 import 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(88)
评论(0)
推荐(0)
摘要：
1如何获取到定位城市的信息 2获取定位城市的代码 封装成函数 直接调用改方法就行 3判断localstorage是否有这个城市 4如果没有就 通过首页中获取定位城市的代码获取 存储到本地中 返回该城市数据 // 1如何获取到定位城市的信息 // 2获取定位城市的代码 封装成函数 直接调用改方法就行 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(45)
评论(0)
推荐(0)
摘要：
1常见的长列表优化方案 常见于移动端 2原理:每次渲染一部分 渲染的数据即将滚动完 在渲染下面的数据 3优点 每次渲染一部分数据 速度快 4数据量打的时候 页面上存在大量dom节点 占用树村过多 5使用场景 数据量不打的情况下 具体看页面的复杂程度 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(44)
评论(0)
推荐(0)
摘要：
1安装react-virtualized 2在项目中导入样式组件 3利用list组件完成 import React from 'react' import axios from 'axios' //导入axios //导入navBar组件 import { NavBar, Icon } from ' 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(122)
评论(0)
推荐(0)
摘要：
1将当前定位城市添加到cityList中 2将当前定位城市的索引添加到cityIndex中 async getCityList() { const res = await axios.get('http://localhost:8080/area/city?level=1') console.log 阅读全文
posted @ 2022-05-30 21:24
前端导师歌谣
阅读(25)
评论(0)
推荐(0)
浙公网安备 33010602011771号