m0_59078472的博客

原创 Git常用命令

【代码】Git常用命令。

原创 数组的方法

最后一个字符（假设该字符位于字符串 stringName 中）的索引值为 stringName.length - 1。charCodeAt() 方法返回 0 到 65535 之间的整数，表示给定索引处的 UTF-16 代码单元。如果指定的 index 值超出了该范围，则返回一个空字符串。字符串中的字符从左向右索引，第一个字符的索引值为 0，charAt() 方法从一个字符串中返回指定的字符。设置全局标志的正则使用test()searchValue为空时。

原创 动态增减表单详解

不知道小伙伴们有没有做过类似的功能，效果图如下看到这个需求的一瞬间小编瞬间陷入了思维逻辑的坑里，想着垃圾桶旁边的提示信息直接放一个插值表达式，插值表达式直接放入，上边输入框v-model绑定的值不就好了。结果做好了增加第一个表单的时候功能是没问题的，相信已经有小伙伴发现了问题所在，增加第二个表单的时候你就会发现第一个表单垃圾桶旁边的提示信息跟第二个增加的表单提示信息是一样的，而且当你上边输入框清空内有内容的时候你会惊奇的发现，两个表单垃圾桶旁边的提示信息都是空的，为什么呢？这是因为插值表达式内填

原创 为什么通过query传参刷新页面数据会丢失？

query传参是拼接在url后的，如果传的值是对象类型的则数据会丢失，如果传的值是字符串则不会丢失。传值页面this.$router.push({path:'xxx',query:{名(随意起个名字):JSON.stringify(值)})接收值的页面this.$route.query.名然后,看接收值的页面需要什么类型例如:JSON.parse(this.$route.query.名)这个样子传的值就不会丢啦 , get到了吗 , 妈妈再也不用担心我的页面数据丢失了

原创 入职拿到新电脑，快速配置前端开发环境

一、安装node和npm在官网下载安装包，双击本地安装输入node -v和npm -v查看是否安装成功二、npm换源淘宝源：https://registry.npm.taobao.org/京东源：http://registry.cnpm.jd.com/安装nrm，可以快速切换npm源新增cnpm源：npm install -g cnpm --registry=https://registry.npm.taobao.org三、git ssh配置在本地git中添加你得git账户和邮箱，用于每次

原创 封装一个利用递归进行深拷贝的方法

function kaobei(newObj, obj) { for (let key in obj) { // obj[key]有可能是数组，有可能是，有简单类型 if (obj[key] instanceof Array) { // obj[key]是数组 newObj[key] = [] kaobei(newObj[key], obj[key]); } else if (obj[key] instanceof Object) {// obj[key]是对象 newOb.

原创 为什么双层循环 冒泡排序_冒泡排序的双重循环理解

主要说一下冒泡排序的一些关键地方的个人理解，比如算法思想，两个循环的作用意义，中间循环变量范围的确定等。原理：比较两个相邻的元素，将值大的元素交换至右端。思路：依次比较相邻的两个数，将小数放在前面，大数放在后面。即在第一趟：首先比较第1个和第2个数，将小数放前，大数放后。然后比较第2个数和第3个数，将小数放前，大数放后，如此继续，直至比较最后两个数，将小数放前，大数放后。重复第一趟步骤，直至全部排序完成。第一趟比较完成后，最后一个数一定是数组中最大的一个数，所以第二趟比较的时候最后一个数不参与比

原创 Vue项目中市与区联动下拉选择框完整代码

1.创建一个城市下拉选择的组件<template> <div style="display: flex;align-items: baseline;"> <el-select class="filter-item" style="width: 130px;" v-model="provAndCity.province" @change="handleProvince" clearable &g

原创 Vue项目中城市下拉选择 城市js文件

/* * @Author: taoshiwei * @Date: 2019-04-09 14:38:13 * @Last Modified by: taoshiwei * @Last Modified time: 2019-04-09 14:38:13 * * 城市 地区 */const datas = [ { city: '北京市', area: [ '东城区', '西城区', '朝阳区', '丰台区', .

原创 button失去焦点 在项目中

if (e.target.nodeName === 'BUTTON') { e.target.blur()//点击的是文字 } else { e.target.parentNode.blur()//点击的是文字的父亲(按钮) }

原创 格式化日期

方法一：返回数据的时候改掉 // 日期转化 timeToNormal(dateArr) { // 日期转化 dateArr.forEach(item => { const year = new Date(item.addDate).getFullYear() const month = new Date(item.addDate).getMonth() + 1 < 10 ? `0${

原创 如何封装一个平铺数组转tree（树）的工具？

// 把平铺数组结构转为tree结构export function tranListToTreeData(arr) { const newArr = [] // 1. 构建一个字典，能根据id快速找到对象 const map = {} // map 格式 {'01':{id:"02", pid:"01", "name":"小张" }} arr.forEach(item => { // 为了计算方便 同意添加children item.children = [].

原创 Vue解决跨域的方法，详细说明

1. 后端写代码(CORS)在响应中添加必要的响应头，让响应回来之后浏览不报错header('Access-Control-Allow-Origin:*'); 允许所有来源访问header('Access-Control-Allow-Method:POST,GET'); 允许访问的方式2. 使用JQuery提供的jsonpmethods: { getData () { var self = this $.ajax({ url: 'http://f..

原创 Vue.use优化全局组件注册

1. 作用: 它是Vue提供一个静态方法，用来向Vue注册插件(增强vue的功能) 文档地址: <https://cn.vuejs.org/v2/api/#Vue-use>2. 格式: Vue.use(obj)3. 说明: Vue.use 可以接收一个对象，Vue.use(obj) 对象obj中需要提供一个 install 函数 在 Vue.use(obj) 时，会自动调用该 install 函数，并传入 Vue构造器4...

原创 vue侦听器

首先要了解侦听器的作用Vue 通过 watch 选项提供了一个更通用的方法，来响应数据的变化。当需要在数据变化时执行异步或开销较大的操作时，这个方式是最有用的。var watchExampleVM = new Vue({ el: '#watch-example', data: { question: '', answer: 'I cannot give you an answer until you ask a question!' }, watch: {

原创 组织架构-编辑-修复-显示详情不准确

在编辑时，只有第一次点编辑时，才能正确显示。随后再点编辑，数据显示不正确了获取详情这个动作在子组件的created中发出的，而created钩子只会执行一次：后续点击关闭弹层时，子组件被没有销毁，它只是隐藏了。解决方案1（ v-if ）：在关闭弹层时，把子组件销毁v-if为false时，子组件会被删除！优点：简单，有效；缺点：有性能消耗，其中的ajax请求也会随着组件的创建和销毁重复执行解决方案2：在父组件中通过引用找到子组件在父组件中，每次打开弹层时，找到子组件，要求它去发请求

原创 如何在新项目使用svg-icon组件

1.安装依赖npm i svg-sprite-loader@4.1.32.配置 vue.config.js const path = require('path')function resolve (dir) { return path.join(__dirname, dir)}

原创 你确定你知道语法糖v-model .sync之间的区别吗？

1. v-model作用: v-model本质上是一个语法糖，v-model用于父子组件之间相互通信的一种方法 ,如果用传统的通过在子组件中的this.$emit通知父组件去$on去监听这个事件会很麻烦,v-model相对于更便捷一些2. v-model原理:<input v-model="test">本质上是<input :value="test" @input="test = $event.target.value">，其中@input是对<input>输入事..

原创 JS 数组常见 API 示例说明

静态方法 Array.isArray(): 判断是否为数组 Array.from(): 把伪数组转换为真数组 注: 伪数组必须有length属性,否则无法转换为真数组,length为几,数组有几个值,如果length大于原数据个数,则多出部分为undefined 实例方法 concat: 链接数组成为新数组 let a1 = [1, 2, 3]; let a2 = ['a', 'b', 'c']; let a3 = [11, 12, 13]; let arr

原创 点了登录请求是如何发出去的？（图示）

原创 点了登录请求是如何发出去的？

表单验证（login/index.vue） utils/validate.js ---> validMobile 调用 api/user.js中封装好的api 找到axios实例：utils/request.js中获取axios实例 设置基地址从环境变量中 收集用户的参数，传给上一步中的api。（页面上收集页面的数据项名与接口中一致） 经过请求拦截器，添加请求头（添加token， utils/request.js）...

原创 Element组件库（table 表单 用法）

table行(data)，决定表格的数据。它是数组，数组中的每一个元素是一个对象，表示一行 列，决定表格结构。 列由el-table-column决定label：决定当前列显示出的标题 prop：决定当前列数据的来源。对于表格来说， 它的数据是一个数组，每一个元素是一个对象，这里的prop值就是这个对象中的属性名 prop="date" prop就是用来从每一个对象中取出属性名为date的 属性值...