个人总结
人间草木96
这个作者很懒,什么都没留下…
展开
-
JS 进阶需要掌握的 12 个概念
本文介绍 JS 比较重要的12个概念,但绝对不是说 JS开发人员只需要知道这些就可以了。1.变量赋值 (值 vs 引用)理解 JS 如何给变量赋值可以帮助我们减少一些不必要的bug。相反,如果,不理解这一点,可能很容易地编写被无意中更改值的代码。JS 总是按照值来给变量赋值。这一部分非常重要:当指定的值是 JavaScript 的五种基本类型之一(即Boolean,null,...原创 2019-10-29 09:34:25 · 134 阅读 · 0 评论 -
JS系统内置函数
var str = 'AAAA';var aTest= new Array(); //['ff'[,'er']] \ new Array(10); \ new Array('ff','fee');var obj = new Obejct(); // {name:'zhangsan',height:198}var today = new Date();// Math对象示需要声明。字符...原创 2018-10-25 16:32:54 · 958 阅读 · 0 评论 -
JS正则表达式(火星文)
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>正则表达式(火星文)</title></head><body><input type="text" id="myText" plac...原创 2020-05-13 13:39:17 · 1169 阅读 · 1 评论 -
JS字符串常用方法 ES5
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>字符串常用方法</title></head><body> <script> let strA = "西湖"; le...原创 2018-10-25 15:59:26 · 336 阅读 · 0 评论 -
JS数组的常用方法总结 ES5
数组的常用方法总结<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body> <script> // 1. 数组.push...原创 2018-10-25 16:11:20 · 193 阅读 · 0 评论 -
vue生命周期的理解
Vue实例有一个完整的生命周期,也就是从开始创建、初始化数据、编译模板、挂载Dom、渲染→更新→渲染、销毁等一系列过程,我们称这是Vue的生命周期。通俗说就是Vue实例从创建到销毁的过程,就是生命周期。每一个组件或者实例都会经历一个完整的生命周期,总共分为三个阶段:初始化、运行中、销毁。 实例、组件通过new Vue() 创建出来之后会初始化事件和生命周期,然后就会执行beforeCre...原创 2018-10-26 13:11:40 · 157 阅读 · 0 评论 -
ES6 用法总结
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <title>Page Title</title> <...原创 2018-11-21 13:58:39 · 311 阅读 · 1 评论 -
CSS居中问题大总结
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equ...原创 2018-12-06 16:34:53 · 465 阅读 · 0 评论 -
前端实现图片下载功能
<a href="http://e.hiphotos.baidu.com/image/pic/item/1c950a7b02087bf49661186dffd3572c10dfcfa1.jpg" download="">下载图片</a>前段日子需要做一个图片下载的功能,本想使用的a标签的download属性就能实现,可是在谷歌浏览器点击按钮图片还是一直只能预览无法直接...原创 2018-12-18 14:00:15 · 16802 阅读 · 6 评论 -
Vue单组件模板——生命周期
<template> <!-- 最外层只能有一个div --> <div class="main"> <!-- 组件使用 --> <Images/> </div></template><script>// 引入组件import Images from "../.....原创 2019-01-10 18:40:22 · 783 阅读 · 0 评论 -
vue脚手架搭建和iview踩坑 "vue": "^2.5.2"
*****先要安装node.js,使用npm包管理工具 node.js安装方法如下*****https://blog.csdn.net/shiyaru1314/article/details/54963027https://blog.csdn.net/qq_42564846/article/details/82688266大家都知道国内直接使用 npm 的官方镜像是非常慢的,这里...原创 2019-01-07 11:07:55 · 10176 阅读 · 2 评论 -
基于vue-cli配置移动端自适应—淘宝弹性布局方案lib-flexible和px2rem-loader实践(750px设计稿)
在vue中引入lib-flexible首先你要确保vue环境搭建成功配置 flexible第一步:安装 lib-flexible, npm install lib-flexible --save第二步:引入 lib-flexible在项目入口文件 main.js 里 引入 lib-flexibleimport Vue from ...原创 2019-01-18 13:39:43 · 2265 阅读 · 1 评论 -
react脚手架搭建和Ant Design配合使用 "react": "^16.7.0"
*****先要安装node.js,使用npm包管理工具 node.js安装方法如下*****https://blog.csdn.net/shiyaru1314/article/details/54963027https://blog.csdn.net/qq_42564846/article/details/82688266大家都知道国内直接使用 npm 的官方镜像是非常慢的,这里...原创 2019-01-08 12:49:39 · 1758 阅读 · 0 评论 -
Vue中非父子组件之间传值
非父子组件(跨级组件和兄弟组件)通信时,使用了bus(中央事件总线)的一个方法,用来触发和接收事件,进一步起到通信的作用。Demo效果展示新建一个bus.js文件,写入如下代码公共bus.js// 公共bus.js// 非父子组件之间传值,需要定义个公共的公共实例文件bus.js,作为中间仓库来传值,不然路由组件之间达不到传值的效果import V...原创 2019-01-24 10:24:23 · 2256 阅读 · 0 评论 -
vue中引入 Vuex
Demo效果展示 第一步:npm 安装 vuex,文件根目录下安装,指令如下npm install vuex --save //安装到生产环境 第二步:在main.js中引入vuex import Vue from 'vue'import App from './App'import router from './router'import Vuex...原创 2019-01-24 17:44:09 · 355 阅读 · 0 评论 -
身份证号脱敏处理,各页面的身份证号隐藏11-16位
解决思路:正则匹配 身份证 从前几个字符,到后几个字符,中间的全部替换为 ******let str = "331082199611095387";str = str.replace(/(\w{10})\w*(\w{2})/, '$1******$2');console.log(str);建议后端对身份证进行隐藏11-16位,前端隐藏的只是显示,但是这样的保护还是有...原创 2019-01-24 17:50:21 · 36730 阅读 · 0 评论 -
对javascript原型prototype和构造函数的理解
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equ...原创 2019-01-21 11:33:29 · 183 阅读 · 0 评论 -
this指向问题和闭包的理解
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equ...原创 2019-01-21 13:25:27 · 202 阅读 · 0 评论 -
防止计时器越跑越快,清除计时器
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /&g原创 2019-01-21 18:19:56 · 1592 阅读 · 0 评论 -
在vue中引入less,sass,Element, iView,Mint UI,axios,moment
在vue中引入less 首先你要确保vue环境搭建成功 第一步:安装less依赖,npm install less less-loader --save-dev //安装到开发环境 --save-dev 与 --save 的区别--save 安装包信息将加入到dependencies(生产阶段的依赖)--save-dev 安装包信息将加入到devDependen...原创 2019-01-16 14:15:03 · 781 阅读 · 0 评论 -
ajax,fetch,axios测试用例
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <meta http-equ...原创 2019-01-22 11:23:02 · 208 阅读 · 0 评论 -
sessionStorage和localStorage的使用
1..sessionStorage的使用sessionStorage.setItem('age',18);//数据存入session 写法1sessionStorage.age = 18;//数据存入session 写法2console.log(sessionStorage.getItem('age'));//获取session中的数据 写法1console.log(...原创 2019-01-22 15:28:01 · 439 阅读 · 0 评论 -
在vue.js中实现a标签href tel的打电话功能
<div v-for="p in persons"> <p> name: {{ p.name }} </p> <p> //正确做法,拼接字符串 tel: <a :href="'tel:' + p.phone">call me</a>原创 2019-01-28 14:39:05 · 5992 阅读 · 0 评论 -
vue.js中内联样式style、class三元表达式
:style 是v-bind:style的简写v-bind指令可以在其名称后面带一个参数,中间放一个冒号隔开,这个参数通常是HTML元素的特性(attribute)style三元表达式<p :style="{'color': (checkIndex3==m.txt ? '#3d8cff':'#BBBBBB')}">{{m.txt}}</p>c...原创 2019-01-28 14:41:47 · 33332 阅读 · 2 评论 -
前端开发细节总结 未完待续.........
1、搜索时,文本输入框的内容一般去掉前后空格let arr = " 2018-11-11 05 "console.log(arr)// 清除左右空格console.log(arr.trim())console.log(arr.replace(/(^\s*)|(\s*$)/g, ""))// 清除全部空格console.log(arr.replace(/\s+/g,""))2、...原创 2019-01-28 14:45:11 · 388 阅读 · 0 评论 -
VUE中引入UEditor富文本编辑器
vue中引入ueditor1.放入静态资源并配置首先把官网下载的Ueditor资源,放入静态资源src/static中。(你的U盘里有,不用下载了) 2.封装一个组件 ueditor.vue ,放到src/components/里<template> <div> <script id="editor" type="text/pl...原创 2019-01-28 15:16:21 · 4162 阅读 · 0 评论 -
vue的监听函数watch()的用法
最近接到一个bug,要求:手机号和密码不输入的情况下,登录按键是灰色的,不可点击;手机号和密码输入的情况下,登录按键是亮色的,可以点击;细想一下用vue的监听函数watch()去解决 watch: { //tel 是data() 里面的数据tel,newVal是tel变化后的值,oldVal是tel变化前的值 tel(newVal...原创 2019-01-23 14:09:00 · 11852 阅读 · 0 评论 -
vue-router 路由进阶学习
一、vue-router 路由跳转1、router-link标签跳转在html标签内使用router-link跳转,相应于超链接a标签,使用方式如下:<router-link to="/">[显示字段]</router-link>to:导航路径使用示例如下:<p>导航 : <router-link to="/">首页...原创 2019-02-14 20:01:37 · 268 阅读 · 0 评论 -
vue中把moment封装成插件(plugins)
首先你要确保vue环境搭建成功第一步:npm 安装 moment,文件根目录下安装,指令如下npm install moment -save //安装到生产环境第二步:如何封装插件首先,创建一个文件。本例中,我将引入一个moment库的插件。我们就把这个文件命名为moment.js吧。最关键的地方在于,我们需要暴露一个将Vue构造器作为第一个参数的in...原创 2019-01-29 11:57:23 · 1011 阅读 · 0 评论 -
vue中把axios封装成插件(plugins)
首先你要确保vue环境搭建成功 第一步:npm 安装axios,文件根目录下安装,指令如下npm install axios --save //安装到生产环境 第二步: 如何封装插件首先,创建一个文件。本例中,我将引入一个axios库的插件。我们就把这个文件命名为axios.js吧。最关键的地方在于,我们需要暴露一个将Vue构造器作为第一个参数的instal...原创 2019-01-29 11:58:49 · 4589 阅读 · 0 评论 -
vue2.0 父组件和子组件之间的传值
父子组件的关系可以总结为 prop 向下传递,事件向上传递。父组件通过 prop 给子组件下发数据,子组件通过事件给父组件发送消息父组件向子组件传值: 子组件在props中创建一个属性,用来接收父组件传过来的值; 在父组件中注册子组件; 在子组件标签中添加子组件props中创建的属性; 把需要传给子组件的值赋给该属性 子组件向父组件传值: 子组件中需要以某种方式(如点击事...原创 2019-01-23 17:12:57 · 304 阅读 · 0 评论 -
vue-router的进阶学习——vue路由的封装和配置
第一步:1.在vue项目里 src/router/ 文件夹下新建 config.js 文件,写入如下代码: const base = '/'const routers = [ { name: '用户管理', child: [ { name: '用户管理列表', url: '/user/index' }...原创 2019-01-29 14:32:26 · 3410 阅读 · 0 评论 -
react-app中引入UEditor富文本编辑器
react中引入ueditor1.放入静态资源并配置首先把官网下载的Ueditor资源,放入public文件夹中。(你的U盘里有,不用下载了) 2.封装一个组件 UEditor.js ,放到src/pages/components/里/** * @module 百度富文本编辑器 * 自定义菜单配置 */import React, { Component } fr...原创 2019-02-21 13:57:26 · 3191 阅读 · 4 评论 -
react-app中引入loading加载动画,刷新页面出现动画
1. 在 public/css 文件里 新建 loading.min.css 文件 写入如下代码:#i-loading{background:#fff;left:0;top:0;right:0;bottom:0;position:fixed;z-index:9999;transition:all .5s ease-out}.i-loading-out{opacity:0;}#i-loadi...原创 2019-02-21 14:36:31 · 3682 阅读 · 1 评论 -
react-app中引入 数据RSA加密
1. 在 public/js 文件里 新建 jsencrypt.min.js 文件 写入如下代码:(function(){function BigInteger(a,b,c){null!=a&&("number"==typeof a?this.fromNumber(a,b,c):null==b&&"string"!=typeof a?this.fromStr...原创 2019-02-21 14:44:53 · 1914 阅读 · 0 评论 -
vue中axios请求拦截、响应拦截的配置
1.在vue项目的 src/ 文件夹下新建一个文件夹为 plugins,然后在 plugins/ 下新建 axios.js 文件,写入如下代码 import axios from 'axios'import { base } from '../router/config'import { config } from '../config'import { Message, M...原创 2019-02-15 18:59:25 · 3693 阅读 · 0 评论 -
vue中webpack中跨域请求proxyTable代理的配置
在vue项目的 config/ 文件夹下的 index.js 文件里的dev ,写入如下代码方便你复制~~~~ // 配置proxy跨域请求代理 proxyTable: { // url中匹配到 '/api' 就会吧url中 '/api' 之前的东西全部替换为下面target中的东西 '/api': { target: 'ht...原创 2019-02-15 19:06:12 · 1406 阅读 · 0 评论 -
年、月、日、时、分、秒、的获取
年、月、日、时、分、秒、的获取 let date = new Date() let year = date.getFullYear() let month = date.getMonth() + 1 >= 10 ? date.getMonth() : `0${(date.getMonth() + 1)}` let day = date.getDate()...原创 2019-02-15 19:16:40 · 301 阅读 · 0 评论 -
前端实现验证码
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <title>验证码</title> <script src="https://cdn.bootcss.com/jque原创 2019-02-15 20:45:17 · 3808 阅读 · 0 评论 -
vue中配置nprogress 页面顶部进度条(在vue路由守卫和路由后置)
1. 安装npm install nprogress --save2. 在main.js中导入源码~~~~~~方便你复制// The Vue build version to load with the `import` command// (runtime-only or standalone) has been set in webpack.base.conf wi...原创 2019-02-16 11:22:01 · 2438 阅读 · 1 评论