- 博客(96)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 React.js实现一个todo-list案例
一、创建项目首先通过create-react-app todo-list命令创建一个名为todo-list的项目，前提是react基本环境已安装好。结构目录如下所示：二、新建父组件如上图所示，在src下新建views文件夹，在该文件夹下添加todo-list.js文件。代码如下所示：import React, { Component, Fragment } from 'react';import '../css/style.css';import TodoItem from '..
2020-06-17 10:54:08
329
原创 leetcode算法题8：字符串转换整数 (atoi)
题目：请你来实现一个atoi函数，使其能将字符串转换成整数。首先，该函数会根据需要丢弃无用的开头空格字符，直到寻找到第一个非空格的字符为止。接下来的转化规则如下：如果第一个非空字符为正或者负号时，则将该符号与之后面尽可能多的连续数字字符组合起来，形成一个有符号整数。假如第一个非空字符是数字，则直接将其与之后连续的数字字符组合起来，形成一个整数。该字符串在有效的整数部分之后也可能会存在多余的字符，那么这些字符可以被忽略，它们对函数不应该造成影响。注意：假如该字符串中的第一个非空格字符不是..
2020-05-14 17:58:59
252
原创 leetcode算法题7：整数反转
题目：给出一个 32 位的有符号整数，你需要将这个整数中每位上的数字进行反转。示例1:输入: 123输出: 321示例 2:输入: -123输出: -321示例 3:输入: 120输出: 21注意:假设我们的环境只能存储得下 32 位的有符号整数，则其数值范围为[−231,231− 1]。请根据这个假设，如果反转后整数溢出那么就返回 0。解析：方法一：转字符串反转var reverse = function (x) { x=x.toStr...
2020-05-14 16:25:39
216
原创 微信小程序wxParse插件解析html
1、在app.json中添加插件 "plugins": { "wxparse": { "version": "1.0.10", "provider": "wx5d60c080635009b1" } }2、在需要使用的页面.json文件中添加组件{ "navigationBarTitleText":"商品详情", "...
2020-04-07 17:58:17
452
原创 跨域请求携带cookie的实现
跨域时，前端向服务器发起请求时，需要将XMLHttpRequest 对象的withCredentials 属性设置为 true，如下所示： $.ajax({ type: "POST", url: url, data:{}, dataType: '...
2020-04-03 16:30:28
565
原创 vue中的全屏事件，按esc退出全屏
1、vue页面中根据是否全屏判断当前显示icon图标，isFull为true时表示全屏，默认值为false，并绑定click事件 <div class="screen-icon-box"> <i :class="isFull?'el-icon-crop':'el-icon-full-screen'" @click="fullScreenEven...
2020-03-23 21:54:56
2597
原创 Vue通过递归实现多级菜单展示
1、模拟后台返回的菜单JSON数据如下data.json文件{ "data": { "router": [ { "path": "", "name": "Home", "component": "Layout", "r...
2020-03-17 11:27:32
2489
原创 git本地仓代码推送到远程仓报错：refusing to merge unrelated histories
当从远程仓库拉取代码到本地时，报错拒绝合并不相关的历史，如下图所示：发生上图原因是由于本地仓库和远程仓库实际上是独立的两个仓库，可以通过使用命令：$git pull origin master --allow-unrelated-histories合并两个独立启动仓库的历史。上面是将远程仓库的文件拉取到本地仓库了。接着将本地仓库的提交推送到远程github仓库上：$...
2020-03-11 22:32:02
259
原创 vue项目打包后字体文件路径出错的解决办法
打包后，css里加载的font文件路径变成了：rootpath/static/css/static/fonts,而期望的应该是rootpath/static/fonts。修改方式：在build/utils的ExtractTextPlugin.extract里加上 publicPath: '../../'：// generate loader string to be used with ...
2019-06-27 09:21:32
2115
原创 vue-cli webpack打包开启Gzip报错
在根目录config/index.js中build内找到productionGzip: false，把false改为true。与productionSourceMap 刚好相反。 然后npm run build。此时会提示找不到"Cannot find module 'compression-webpack-plugin'"。 npm install --save-de...
2019-05-26 21:56:49
414
原创 vue视图刷新的几种方法
更新数组时，如果直接通过下标修改数组属性的话，vue页面不会更新。通过以下几个方法更新数组push()、pop()、shift()、unshift()、splice()、sort()时，vue才能检测到数组更新。如果想直接通过下标修改数组的话，可使用vm-set 方法来通知vue更新了这个数组。语法为：vm.$set( target, key, value );数组修改：Vue.se...
2019-05-19 20:09:49
5299
原创 微信小程序开发步骤（二）页面搭建
在上一章中讲述了如何创建项目，这一章主要讲述小程序中代码目录架构，以及创建新页面。一、目录架构1、app.js是小程序的脚本代码。我们可以在这个文件中监听并处理小程序的生命周期函数、声明全局变量。调用框架提供的丰富的 API，如本例的同步存储及同步读取本地数据。//app.jsApp({ onLaunch: function () { // 展示本地存储能力 v...
2019-05-07 22:00:58
528
原创 时间戳转为年月日时分秒格式
1、小于10前面补0function add0(m){ return m<10?'0'+m:m }2、转为年-月-日 时:分:秒格式function timeFormat(ts){ var time = new Date(ts); var y = time.getFullYear(); var m = time.getMonth()+1; ...
2019-04-29 23:22:34
2383
原创 百度地图的常用事件和方法
1、滚轮缩放 map.enableScrollWheelZoom(); //启用滚轮放大缩小，默认禁用 map.enableContinuousZoom(); //启用地图惯性拖拽，默认禁用2、拖拽 map.enableDragging(); //开启拖拽 map.enableInertialDragging(); //开启惯性拖拽3、事...
2019-04-29 22:56:21
4857
原创 vue项目报错Uncaught SyntaxError: Unexpected token <
vue项目在引入第三方依赖的 JS 文件时，报如下错误：Uncaught SyntaxError: Unexpected token <检测后发现原来我的 JS 文件是放在 /src/utils 文件夹下的，但引入 /src 和 /static 的文件是有区别的。解决办法是将第三方依赖的 JS 文件放到 /static/utils 目录下。因为src目录下的资源只能impo...
2019-04-23 09:26:23
1440
原创 微信小程序开发步骤（一）项目创建
一、申请账号进入小程序注册页注册自己的小程序帐号，如下图所示：登录小程序后台，可在菜单 “设置”-“开发设置” 看到小程序的AppID了 。二、安装开发工具前往开发者工具下载页面，根据自己的操作系统下载对应的安装包进行安装。下载完成之后，打开小程序开发者工具，用微信扫码登录开发者工具。三、建立项目新建项目选择小程序项目，选择代码存放的硬盘路径，填入刚刚申请...
2019-04-21 23:01:29
1203
原创 已知某一点坐标、线段长度和旋转角度，求另一点坐标
/** 已知某一点坐标，旋转角度，长度，求另一点坐标 */export const calculateCoordinatePoint = (originPoint, degree, len) => { let rotate = (degree - 90 + 360) % 360; //这里是因为一开始以y轴下方为0度的 let point = { x:...
2019-03-31 21:39:06
10762
2
原创 计算某一点绕另一点旋转一定角度后的坐标
/** * 计算某一点旋转后的坐标点 * @param point * @param degree */export const calculateRotate = (point, degree) => { let x = point.x * Math.cos(degree * Math.PI / 180) + point.y * Math.sin(degree * Ma...
2019-03-31 21:22:31
7226
原创 高阶函数之sort
1、排序算法是在程序中经常用到的算法。无论使用冒泡排序还是快速排序，排序的核心是比较两个元素的大小。通常规定，对于两个元素x和y，如果认为x < y，则返回-1，如果认为x == y，则返回0，如果认为x > y，则返回1（升序）。这样，排序算法就不用关心具体的比较过程，而是根据比较结果直接排序。如下所示：var arr = [10, 20, 4, 6];arr.sort(fu...
2019-03-23 21:20:59
367
原创 Vue和Element-UI做一个简单的登录页面
如下所示，是vue+ElementUI写的一个登录页面：Login.vue部分<template> <el-form :model="loginForm" :rules="loginRules" ref="loginForm" label-position="left" label-width="0px" class="d
2019-03-01 11:09:19
7296
4
原创 Element组件之Form表单
这里主要介绍Element组件中的Form表单，它是由输入框、选择器、单选框、多选框等控件组成，用以收集、校验、提交数据。典型表单：在 Form 组件中，每一个表单域由一个 Form-Item 组件构成，表单域中可以放置各种类型的表单控件，包括 Input、Select、Checkbox、Radio、Switch、DatePicker、TimePicker。行内表单：设置inline属...
2019-03-01 11:08:13
12598
1
原创 vue中的 ref 和 $refs
1.ref 加在普通的元素上，用this.$refs.refName 获取到的是dom元素2.ref 加在子组件上，用this.$refs.refName 获取到的是组件实例，可以使用组件的所有方法。 <el-form :model="loginForm" :rules="loginRules" ref="loginForm" label-position="left" label...
2019-03-01 09:48:16
451
翻译 vue中的 render: h => h(App) 具体含义
render: h => h(App)是下面内容的缩写：render: function (createElement) { return createElement(App);}进一步缩写为(ES6 语法)：render (createElement) { return createElement(App); }...
2019-03-01 09:33:47
727
原创 let 和 const 命令与var的区别
1、基本用法ES6 新增了let和const命令，用来声明变量。它的用法类似于var，但是所声明的变量，只在let命令所在的代码块内有效。{ let a = 10; var b = 1;}a // ReferenceError: a is not defined.b // 1而const声明一个只读的常量。一旦声明，常量的值就不能改变。对于const来说，只声明不赋值，...
2019-02-28 15:50:59
257
原创 vue项目中配置title图标和文字
在项目的index.html 中引入图片：<head> <title>标题</title> <link rel="icon" href="./favicon.ico" type="image/x-icon"></head>其中，favicon.ico图片在项目根目录下。接着就是修改 buil
2019-02-28 11:25:06
2513
原创 VUE+ElementUI开发后台功能,隐藏左侧菜单栏再展开有白框问题解决方法
在methods里的collapse 函数里增加监测左边导航栏offsetWidth值为0则修改，如下所示：//折叠导航栏 collapse:function(){ this.collapsed=!this.collapsed; var menuWidth = document.getElementById('menuClass'); if(menuWidth.o...
2019-02-28 09:32:04
10248
原创 vue中引入font-awesome报错
npm install --save font-awesome 之后在main.js中这样引入import 'font-awesome/css/font-awesome.css'报错如下图 This dependency was not found:* font-awesome in ./src/main.jsTo install it, you can run...
2019-02-27 14:45:49
2884
1
转载 2018年最值得关注的30个Vue开源项目
NO.1Element：一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库 [Github star：22004]。NO.2iView：一套高质量的UI组件库 [Github star：12175]。NO.3Best-resume-ever：用Vue和LESS简单、快速建立许多漂亮的简历，并创建你最好的简历。[Github star：8839]。NO....
2019-02-26 09:07:51
359
原创 npm install报错之解决方法
npm install时报错如下图所示：D:\Vue\demo>npm installnpm WARN deprecated [email protected]: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.npm WARN deprecated bfj...
2019-02-24 20:33:32
4029
原创 浏览器工作原理之树的构建
一、DOM树的构建 DOM 输出的树，也就是解析树，是由DOM元素及属性节点组成的。DOM是文档对象模型的缩写，它是html文档的对象表示，作为html元素的外部接口供js等调用。树的根是“document”对象。 DOM和标签基本是一一对应的关系，例如，如下的标签：<html><body><p>Hello DOM</p...
2019-01-27 22:30:17
243
原创 浏览器工作原理
一、浏览器的主要功能浏览器的主要功能是将用户选择的web资源呈现出来，它需要从服务器请求资源，并将其显示在浏览器窗口中，资源的格式通常是HTML，也包括PDF、image及其他格式。用户用URI（Uniform Resource Identifier统一资源标识符）来指定所请求资源的位置。 HTML和CSS规范中规定了浏览器解释html文档的方式，由W3C组织对这些规范进行维护，W3C是...
2019-01-27 22:16:13
187
原创 http和https介绍
一、基本概念http: 超文本传输协议，是互联网上应用最为广泛的一种网络协议， 是一个客户端和服务器端请求和应答的标准（TCP）， 用于从WWW服务器传输超文本到本地浏览器的传输协议， 它可以使浏览器更加高效，使网络传输减少。https: 是以安全为目标的HTTP通道，简单讲是HTTP的安全版， 即HTTP下加入SSL层，HTTPS的安全基础是SSL， 因此加密的详细内容就需要SSL。 h...
2019-01-13 21:48:57
377
原创 CSS之水平垂直居中布局的实现方法
前端HTML部分代码如下：<div class="parent"> <div class="child">Test</div></div>里面的容器和外面的容器宽高是不确定的，实现这三种布局的方法如下：一、水平居中布局1、inline-block+text-align这种方法下IE6、IE7不支持inline-block...
2019-01-13 21:24:55
187
原创 apply, call和bind的区别
三者都可以把一个函数应用到其他对象上，注意不是自身对象。apply和call是直接执行函数调用，bind是绑定，执行需要再次调用。 apply和call的区别是apply接受数组作为参数，而call是接受逗号分隔的无限多个参数列表。function Person() { }Person.prototype.sayName() { alert(this.name); } ...
2018-12-31 19:33:54
135
原创 Vue的生命周期
1、什么是Vue的生命周期？Vue 实例从创建到销毁的过程，就是生命周期。从开始创建、初始化数据、编译模板、挂载Dom→渲染、更新→渲染、销毁等一系列过程，称之为 Vue 的生命周期。2、简介beforeCreate（创建前）：在数据观测和初始化事件还未开始 。created（创建后）：完成数据观测，属性和方法的运算， 初始化事件，$el属性还没有显示出来。beforeMou...
2018-12-31 19:25:12
144
原创 cookies，sessionStorage 和 localStorage 的区别
cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上的数据（通常经过加密）。 cookie数据始终在同源的http请求中携带（即使不需要），且会在浏览器和服务器间来回传递。sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。 存储大小： cookie数据大小不能超过4k。 sessionStorage和localStora...
2018-12-31 19:12:29
121
原创 clone
题目：实现一个函数clone，可以对JavaScript中的5种主要的数据类型（包括Number、String、Object、Array、Boolean）进行值复制。方法一：Object.prototype.clone = function() {var o = this.constructor === Array ? [] : {};for (var e in this) {o[...
2018-12-31 19:04:31
211
转载 前端资源汇集
1、综合类：前端知识体系 http://www.cnblogs.com/sb19871023/p/3894452.html 前端知识结构 https://github.com/JacksonTian/fks Web前端开发大系概览 https://github.com/unruledboy/WebFrontEndStack Web前端开发大系概览-中文版 h...
2018-12-05 08:33:15
174
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人