学习项目
关注
分享
扫一扫
文章平均质量分 58
dreamimport
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
js+css钟表
【代码】js+css钟表。原创 2023-02-01 17:16:07 · 163 阅读 · 0 评论 -
用JavaScript写的一个录屏功能简直太香
用JavaScript写的一个录屏功能简直太香使用JavaScript的API mediaDevices 实现录屏功能，亲测有效直接贴代码使用JavaScript的API mediaDevices 实现录屏功能，亲测有效这个不是本人写的，是看了Sunshine_Lin的文章，发现这么好玩的功能的直接贴代码index.html<!DOCTYPE html><html> <head> <title>录屏功能</title原创 2021-11-12 11:20:35 · 1222 阅读 · 1 评论 -
使用js写的一个随机分组
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> body{ width: 100%; ..原创 2021-02-23 17:54:00 · 1550 阅读 · 2 评论 -
移动端兼容问题总结（摘抄总和）
从各个地方各个大佬的发现问题的文章总和而来给移动端添加点击事件会有300S的延迟如果用点击事件，需要引一个fastclick.js文件，解决300s的延迟一般在移动端用ontouchstart、ontouchmove、ontouchend移动端点透问题,touchstart 早于 touchend 早于click,click的触发是有延迟的，这个时间大概在300ms左右，也就是说我们tap触...原创 2020-03-24 11:07:37 · 302 阅读 · 0 评论 -
点击input框时改变边框颜色和占位符字体颜色
<input type="text" name="" class="" placeholder="请填写您的姓名"> <input type="text" name="" class="" placeholder="请填写手机号码">.info_contents_5 .info_con_padding input{ width: 100%; ...原创 2020-03-17 12:04:18 · 2327 阅读 · 0 评论 -
移动端兼容（2）
1.禁止图片点击放大部分安卓手机点击图片会放大，如需要禁止放大，只需要设置css属性img{ pointer-events: none; } 这个会让img标签的点击事件失效，如果想要给图片添加点击事件就要给上面再写一层2.禁止 iOS 识别长串数字为电话<meta name="format-detection" content="telephone=no">...原创 2020-03-12 15:09:33 · 137 阅读 · 0 评论 -
移动端兼容问题（1）怎么判断是安卓还是 ios
//获取浏览器的userAgent,并转化为小写var ua = navigator.userAgent.toLowerCase();//判断是否是苹果手机，是则是truevar isIos = (ua.indexOf('iphone') != -1) || (ua.indexOf('ipad') != -1);if(isIos){ 做苹果手机兼容}else{ 做安卓}...原创 2020-03-12 15:04:02 · 277 阅读 · 0 评论 -
websocket的使用
什么是websocketWebsocket是应用层第七层上的一个应用层协议，WebSocket 的最大特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话。HTTP 有 1.1 和 1.0 之说，也就是所谓的 keep-alive ，把多个 HTTP 请求合并为一个，但是 Websocket 其实是一个新协议，跟 HTTP 协议基本没有关系，只是为了...原创 2020-03-12 14:58:21 · 241 阅读 · 0 评论 -
地图找房完善
import React from 'react'// 导入axiosimport axios from 'axios'import { Link } from 'react-router-dom'import { Toast } from 'antd-mobile'// 导入封装好的 NavHeader 组件import NavHeader from '../../compone...原创 2020-03-10 16:39:36 · 127 阅读 · 0 评论 -
React实现地图找房（2）百度地图API的使用
import React from 'react'// 导入axiosimport axios from 'axios'// 导入封装好的 NavHeader 组件import NavHeader from '../../components/NavHeader'// 导入样式// import './index.scss'import styles from './index...原创 2020-03-10 15:45:11 · 597 阅读 · 0 评论 -
React 实现地图找房功能（1）百度API的用法
import React from 'react'// 导入axiosimport axios from 'axios'// 导入封装好的 NavHeader 组件import NavHeader from '../../components/NavHeader'// 导入样式// import './index.scss'import styles from './index...原创 2020-03-10 11:26:04 · 309 阅读 · 0 评论 -
React 中解决组件之间的样式覆盖---CSS IN JS
推荐使用：CSS Modules （React脚手架已集成，可以直接使用）原创 2020-03-10 10:15:30 · 2217 阅读 · 0 评论 -
react中百度地图的使用
import React from 'react'import './index.scss'export default class Map extends React.Component{ // 在钩子函数中初始化地图 componentDidMount(){ // 初始化地图实例 const map = new window.BMap.Ma...原创 2020-03-06 17:18:30 · 312 阅读 · 0 评论 -
城市列表（3）点击切换定位城市
// 切换城市 changeCity({label,value}){ if(HOUSE_CITY.indexOf(label)>-1){ localStorage.setItem('hkzf_city',JSON.stringify({label,value})) this.props.history.go(-1)...原创 2020-03-06 17:11:17 · 871 阅读 · 0 评论 -
城市列表（2）长列表渲染
1.长列表（城市列表，通讯录，微博等）大型数据表格会使页面出现卡顿，不流畅等性能问题原因：大量的Dom重绘重排，或者设备老旧解决：懒加载，可视区渲染懒加载：（常用于移动端）每次只渲染一部分数据，渲染的数据滚动时，在加载剩余部分数据量不大时可以使用，不然会出现卡顿，不流畅等性能问题、可视区渲染：（react- virtualized）只渲染可视区列表的内容，看不见的区域不渲染，滚动列表...原创 2020-03-06 16:51:27 · 436 阅读 · 1 评论 -
ajax和art-template模板的基本使用
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>数据获取和模板渲染&l...原创 2020-03-05 19:48:47 · 434 阅读 · 0 评论 -
react城市列表获取（1）
import React from 'react'//导入的ant-moblie ui组件import { NavBar, Icon } from 'antd-mobile';import './index.scss'import axios from 'axios'//工具包utils的获取当前定位城市import {getCurrentCity} from '../../utils...原创 2020-03-05 18:00:55 · 627 阅读 · 0 评论 -
react中把当前定位城市封装到utils工具包中
import axios from 'axios'// 创建并导出定位城市的函数export const getCurrentCity=()=>{ // 判断本地存储中是否有定位城市 const localCity = JSON.parse(localStorage.getItem('hkzf_city')) if(!localCity){ // 使用pro...原创 2020-03-05 17:48:49 · 527 阅读 · 0 评论 -
移动端常用布局一
1.设置视口标签以及引入初始化样式 <meta name="viewport" content="width=device-width, user-scalable=no,initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <link rel="stylesheet" href="css/nor...转载 2020-03-04 17:12:01 · 133 阅读 · 0 评论 -
解决双击选中字
鼠标双击事件：解决鼠标双击默认选中文字 window.getSelection?window.getSelection().removeAllRanges():document.selection.empty();原创 2020-02-29 16:33:44 · 745 阅读 · 0 评论 -
canves的实例应用
实例应用原创 2020-02-25 17:04:57 · 129 阅读 · 0 评论 -
网页中如何用地图定位公司地址
联系我们地图效果原创 2020-02-25 16:58:20 · 1025 阅读 · 0 评论 -
实现简繁体切换
https://blog.youkuaiyun.com/qq_35817006/article/details/74626728原创 2020-02-25 16:46:49 · 441 阅读 · 0 评论 -
GIT（码云）的使用
1.安装在Windows上使用Git，可以从Git官网直接下载安装程序进行安装。测试命令：git --version2.点击网站右上角“登录”，登录码云，并进行账号设置3.在本地创建公钥：在终端运行：ssh-keygen -t rsa -C “xxx@xxx.com”4.找到公钥地址：Your identification has been saved in /c/Users/My...原创 2020-02-25 16:36:11 · 290 阅读 · 0 评论 -
react项目搭建
使用脚手架初始化项目（hkzf-mobile项目名字）使用 npx create-react-app hkzf-mobile进入到项目根目录 使用 npm start调整后的结构安装ui组件 阿里的一个antd-mobile 组件库npm install antd-mobile --save导入组件导入样式// 导入组件import { Button } from 'an...原创 2020-02-25 16:26:22 · 255 阅读 · 0 评论 -
小程序使用wepy框架搭建项目
初始化项目运行 wepy init standard heima_ugo 命令，初始化小程序项目运行 cd heima_ugo 进入项目根目录运行 npm install 安装所有依赖项运行 wepy build --watch 命令，开启 wepy 项目的实时编译功能打开微信开发者工具，加载 wepy 项目并查看效果解决 ESLint 语法报错问题梳理项目结构清理并重置 s...原创 2020-02-25 16:15:40 · 261 阅读 · 0 评论 -
小程序原生项目搭建
1.打开微信开发者工具，选择新建项目，填写项目名称，选择目录，填写APPID，其他默认，点击新建。创建完成后，删除默认页面，app.json页面下的pages里内容清空。2.重构app.json文件{ "pages": [ "pages/home/home", "pages/cates/cates", "pages/search/sea...原创 2020-02-25 16:03:06 · 1114 阅读 · 0 评论 -
VUE项目搭建
1.安装脚手架npm install -g @vue/cli2.打开界面vue ui3.修改默认配置打开项目的src目录，点击main.js文件（入口文件）import Vue from 'vue'import App from './App.vue'import router from './router'import './plugins/element.js'Vue.c...原创 2020-02-25 15:17:53 · 164 阅读 · 0 评论 -
安装node后，下载包用npm的时候，报错。4048
问题：node 的版本太低，有些功能应用不了，下载了一个新的版本，直接安装了，没有删除低版本，但是能够安装，也能用，只是在用npm下载某些包，或者用npm 运行某个命令时，就会报4048的错误。解决：1、删除npmrc文件，删除C:\Users\Administrator.npmrc文件2、 C:\Users\Administrator\AppData\Roaming\npm-cache 清...原创 2019-11-08 11:10:56 · 863 阅读 · 0 评论 -
项目进行中的bug--三级分类
项目进行中的bug描述：功能：当选中三级分类时，才显示对应的表格数据，但是在项目开发过程中，当选中二级分类时也会渲染对应的表格数据，但是对表格数据进行操作时，因为操作需要依赖三级分类中的ID。因此项目可能会出现错误。解决：在判断分类是否为三级分类时，当不是三级分类的时候就把对应的表单数据重置为空。就不会显示对应的数据了。...原创 2019-10-24 20:32:23 · 278 阅读 · 0 评论 -
开发项目中遇到的级联选择器问题
标题欢乐购电商项目开发中遇到的关于element-ui中有关级联选择器的问题在做多级关联的功能时 用到了element-UI中级联选择器，但是出现了一个问题就是子级联的显示高度沾满屏幕高度，无法查看自己的级联选择器是否正确，这个问题是官方的问题，没有设置高度，因此需要我们在全局给el-cascader-panel 设置一个高度就好了。.el-cascader-panel {height: ...原创 2019-10-24 19:08:04 · 354 阅读 · 0 评论 -
XHTML与HTML的区别
XHTML：1. 所有标记必须要有一个相应的结束标记2. 所有标签的元素和属性的名字必须是小写3. 所有的XHTML标记必须合理嵌套4. 所有的属性必须用"“括起来5. 把所有的特殊符号如>或&，都用编码标识6. 给所有属性赋值 =” "7. 在注释中不能用"–" == “”8. 图片必须有说明文字...原创 2019-09-27 13:43:03 · 155 阅读 · 0 评论 -
在ajax上传图片中，上传一次却保存两张一摸一样的图片
解决：1： 看创建formdata表单是否是一个空的表单。 var formData = new FormData();2： 看服务器是否调用了两次地址3：看追加属性时，是否追加了两次formData.append('attrName', this.files[0]);...原创 2019-09-26 19:01:18 · 340 阅读 · 0 评论 -
清除浮动的方式
给父级定义高这种方式只适用于有具体的高。一般不建议使用。隔墙法： 结尾处加空div标签。并添加属性：clear:both.父级div 定义伪类属性：假如给div定义一个clearfix的类属性 .clearfix:after { clear:both; } .clearfix { zoom:1; //ie6,7 专门清除浮动的样式,解决不识别伪元素问题*/...原创 2019-09-26 18:18:12 · 112 阅读 · 0 评论 -
Node.js学习项目---多人博客系统
Node.js学习项目—多人博客系统初始化准备1.文件夹初始化 项目名称blogpublic文件夹–放置静态资源router文件夹–放置路由功能文件views文件夹–放置所需模板文件model文件夹–放置数据库所需文件2. 打开命令行，开启数据库服务 并创建package.json文件–存储所需下载的包和模块npm install init-y//先下载所需的npm inst...原创 2019-09-21 20:04:34 · 1118 阅读 · 0 评论