09 2020 档案
摘要：##实现效果 ##数据返回结构 ##封装数据处理方法 ##数据处理方法代码 export const scaleMaintenancedata = (data) => { // author: let newdata = JSON.parse(JSON.stringify(data)); newda
阅读全文
摘要：##设计图 ##需求 根据推广渠道后端返回一个推广人员对应的一个或多个渠道信息； ##后端返回数据结构 这里的volist是一个或多个； ##解决思路 首先实现的效果用到element-ui的多级表头，即el-table-column 里面嵌套 el-table-column 这里合计、百度、搜狗。
阅读全文
摘要：##1.定义方法 ##2.表格统计方法 ##3.方法代码 getSummaries(param) { const { columns, data } = param; const sums = []; // console.log(columns, data, "columns,data"); co
阅读全文
摘要：需求：遇到相同内容的进行表格的上下合并 比如我的需求是把相同的一级部门，二级部门相同的合并单元格 效果 ##1.表格绑定单元格合并方法 ##2.data定义变量（命名不规范） 为了演示：： ##3.定义合并单元格rowspan方法 rowspan(spanArr, position, spanNam
阅读全文
摘要：##解决方案 解决方案：使用@key.enter.native <el-input v-model="form.loginName" placeholder="账号" @keyup.enter.native="doLogin"> </el-input>
阅读全文
摘要：第一步，封装函数 封装 将 阿拉巴数字 转换为 汉字数字的函数 convertToChinaNum(num) { var arr1 = new Array('零', '一', '二', '三', '四', '五', '六', '七', '八', '九'); var arr2 = new Array(
阅读全文
摘要：##代码 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>css实现筛子动画</title> </head> <body> <div class="wrapper"> <div class="box1"> <
阅读全文
摘要：主要是利用flex的一些特性来写的，掌握好flex基础，写出筛子的几个页面不是问题。 推荐去我写的一个博客中有flex的小练习 线上练习flex布局 html <body> <div class="shaizi"> <div class="top"> <div class="box1 box"> <
阅读全文
摘要：##需求 想要统计一下自己写的vue项目的代码量。 主要是src文件夹下的html、css、js、vue文件的总代码量 ##解决方案 使用git bash，切换至vue项目的src目录下，然后输入如下命令： find . "(" -name "*.html" -or -name "*.js" -or
阅读全文
摘要：##1.题目 const obj = { 1: 200, 2: 140, 5: 400 }; function translate(obj) { // 请在此处添加代码 } // 输出 [200, 140, null, null, 400, null, null, null, null, null,
阅读全文
摘要：##分页组件 ##分页方法 调用查询方法 传递的val就是第几页 ##查询方法
阅读全文
摘要：首先在el-table组件挂载一个ref="configurationTable"，然后在每次请求数据成功后动一动 表格的默认宽度this.$refs.configurationTable.$el.style.width = '99.99%' ##1.table组件 ##2.请求数据后
阅读全文
摘要：##HTML <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" :render-content="renderContent" :highlight-current="true" ></el-tree>
阅读全文
摘要：开发环境为了调试，会添加大量的console.log，但如果console.log提交到生产环境里面， 不仅仅会影响到代码执行性能，而且可能会泄露一些核心数据，所以我们更希望的是在生产环境， 将所有的console.log清除掉，怎么做呢？ #方法1 ##1.安装插件 需要安装babel-plugi
阅读全文
摘要：#Vue3.0新体验之setup ##setup介绍 setup是Vue3.0提供的一个新的属性，在setup中通过reactive初始化了一个响应式数据， 然后通过return返回了一个对象，对象中包含了声明的响应式数据和一个方法，，而这些 数据就可以直接使用到了template中了。 ##set
阅读全文
摘要：##了解proxy Proxy是ES6新推出的一个特性，可以用它去拦截js操作的方法，从而对这些方法进行代理操作。 举个例子： const laowang = { loveLetter: '我喜欢你，我想和你睡觉' } const proxy = new Proxy(laowang, { get(t
阅读全文
摘要：##1.介绍下 Set、Map、WeakSet 和 WeakMap 的区别？ Set 成员唯一、无序且不重复 [value, value]，键值与键名是一致的（或者说只有键值，没有键名） 可以遍历，方法有：add、delete、has WeakSet 成员都是对象 成员都是弱引用，可以被垃圾回收机制
阅读全文
摘要：##内部监听生命周期函数 export default { mounted() { this.chart = echarts.init(this.$el) // 请求数据，赋值数据 等等一系列操作... // 监听窗口发生变化，resize组件 window.addEventListener('re
阅读全文
摘要：##1.$nextTick是什么？ vue实现响应式并不是数据发生变化后dom立即变化，而是按照一定的策略来进行dom更新 nextTick 是在下次 DOM 更新循环结束之后执行延迟回调，在修改数据之后使用nextTick， 则可以在回调中获取更新后的 DOM。 ##2.v-for key的作用
阅读全文
摘要：##1.清除浮动的方法 方法一：给父级div定义 高度 原理：给父级DIV定义固定高度（height），能解决父级DIV 无法获取高度得问题。 优点：代码简洁 缺点：高度被固定死了，是适合内容固定不变的模块。 方法二：使用空元素，如<div class="clear"></div> (.clear{
阅读全文
摘要：##一.发送效果 ###HTML <div id="send-btn"> <button> // 这里是一个svg的占位 Send </button> </div> ###css #send-btn{ display: flex; align-items: center; justify-conte
阅读全文
摘要：##new new 运算符创建一个用户定义的对象类型的实例或具有构造函数的内置对象的实例。new 关键字会进行如下的操作： 创建一个空的简单JavaScript对象（即）； 链接该对象（即设置该对象的构造函数）到另一个对象 ； 将步骤1新创建的对象作为this的上下文 ； 如果该函数没有返回对象，则
阅读全文
摘要：##一、new 操作符 + Object 创建对象 var person = new Object(); person.name = "lisi"; person.age = 21; person.family = ["lida","lier","wangwu"]; person.say = fun
阅读全文
摘要：封装防抖节流函数 ##防抖 // 防抖函数 function debounce(fn,delay) { let timer = null; return ()=>{ // 清楚上一次的计时器 clearTimeout(timer) timer = setTimeout(()=>{ // 改变this
阅读全文
摘要：##vue2.0 <body> <input type="text" id="inpName"> <span id="spanName"></span> <script> let obj = { name:'' } let newObj = JSON.parse(JSON.stringify(obj
阅读全文
摘要：##1.reduce实现数组去重 var myArray = [1,2,2,3,4,4]; var myOrderedArray = myArray.reduce(function (accumulator, currentValue) { //accumulator有初始值 赋值为空数组 空数组中
阅读全文
摘要：首先你要理解下面三句话 1.元素绑定事件，方法中的this是当前操作元素 2.方法名前面是否有点，有点，点前面是谁，this就是谁，没有this是window（严格模式下是undefined） 3.构造函数执行，方法中的this是当前类的一个实例。 下面通过不同的情况来解释一下： ##1.全局环境,
阅读全文
摘要：##作用域 作用域是在定义的时候就创建了， 而不是运行的时候。看看下面这个例子： let a=1 function aa(){ console.log(a) //输出1 } function bb(){ let a=2 aa() } 是不是非常违背常理啊，你看嘛，aa在bb里面调用的，aa函数里面没
阅读全文
摘要：###经典型转换练习：(都能答对真的很厉害了,留个名让我关注膜拜一下) 1 + '1' true + 0 {}+[] 4 + {} 4 + [1] 'a' + + 'b' console.log ( [] == 0 ) console.log ( ! [] == 0 ) console.log (
阅读全文
摘要：##1.设置input 的placeholder的字体样式 input::-webkit-input-placeholder { /* Chrome/Opera/Safari */ color: red; } input::-moz-placeholder { /* Firefox 19+ */ c
阅读全文
摘要：##1.下图代码哪一个是正确的？ ##2.下图代码哪一个是正确的？ ##3.下图代码哪一个是正确的？ ##4.下图代码哪一个是正确的？ ##5.下图代码哪一个是正确的？ ##1-5答案 B A D B A ##6.下图代码哪一个是正确的？ ##7.下图代码哪一个是正确的？ ##8.下图代码哪一个是正
阅读全文
摘要：##1.有哪些常见的Loader？你用过哪些Loader？ raw-loader：加载文件原始内容（utf-8） file-loader：把文件输出到一个文件夹中，在代码中通过相对 URL 去引用输出的文件 (处理图片和字体) url-loader：与 file-loader 类似，区别是用户可以设
阅读全文
摘要：传送门vue面试题（1） ##1. Vue 实例的 data 属性，可以在哪些生命周期中获取到？ beforeCreate created beforeMount mounted ##2. 下列对 Vue 原理的叙述，哪些是正确的？ Vue 中的数组变更通知，通过拦截数组操作方法而实现 编译器目标是
阅读全文
摘要：##1.下面代码的输出是什么? const one = (false || {} || null) const two = (null || false || "") const three = ([] || 0 || true) console.log(one, two, three) ##2.下
阅读全文
摘要：查漏补缺的javascript面试题 这里面有很多js作用域，变量提升等一系列的基础问题以及答案解析。 点击此处跳转到查漏补缺的javascript面试题 前端面试秘籍 从html->dom->css->js->浏览器相关->计算机网络->wbpack->模块化，详细的看下本篇基础，面试就差不多了。
阅读全文
摘要：##安装WinSCP 首先，我们先去官网下载 WinSCP，点击下图所示的下载即可。 ##新建站点 打开 WinSCP，系统自动要求新建站点登录。 文件协议选择 SFTP，主机名填入自己服务器的公网ip，端口号选择 22。用户名和密码填入自己登入服务器的用户名和密码。填写完毕之后，点击登录。 登录完
阅读全文
摘要：很多时候我们都会遇到跨域问题，现在最普遍的解决问题的办法就是nginx，不会安装的请看我上一篇博客，nginx的简单使用，本篇主要介绍本地的html文件如何访问后端电脑的接口文件，或者访问线上的接口地址文件 ##nginx配置 ###本地配置 location / { root E:/nginxte
阅读全文
摘要：下载nginx 下载地址 ##最好下载图示稳定版的 解压 解压之后我们可以看到下图目录结构 新建文件 我们再e盘新建一个测试文件，里面简单的写几个字 配置nging中的conf下的nginx.conf ##启动nginx ###第一种方法，直接点击exe文件 ###第二种使用命令启动 start n
阅读全文
摘要：##log报错信息 (1113: No mapping for the Unicode character exists in the target multi-byte code page) ##解决办法 使用windows版本的nginx启动时遇到(1113: No mapping for th
阅读全文
摘要：把form中data声明的数据抽离出来，通过父亲向每个子组件传递过去，各个子组件公用一个data 这样我们可以把前几个step填写的内容在最后一个step显示出来供我们确认信息是否正确 实现 ##1.项目目录接结构 ##2.module文件创建公共数据 form.js const form = {
阅读全文
摘要：#总结vue中常问到的一些问题。 ##1.说说你对 SPA 单页面的理解？ SPA在页面初始化的时候加载相应的html，css，js，一旦加载完成，spa页面不会因为用户的操作而发生页面的跳转或者是重新加载，而是通过路由的方式改变HTML的内容，避免页面的重新渲染 优点： 用户体验好、快，内容的改变
阅读全文
摘要：solt的使用,复制代码时注意引入的路径是否正确，组件是否注册，是否传递的数据等 ##简单使用 ###父组件 <template id='test'> <div class="test"> <header v-for="info in person" :key="info.name"> <slot
阅读全文
摘要：“我在手机上，看别人的撸猫玩狗的精彩生活，读着令人捧腹的精彩段子，和未曾见面的沙雕网友快乐互动，我突然发现， 我已沉迷手机。我决定放下手机，感受身边的世界，然后我发现，原来，我的身边没有朋友，我的身边没有有趣的事， 我的生活，一点都不美好。最后我觉得，还是手机好。我，爱，手，机。” 大半的人在二十岁
阅读全文
摘要：let name = 'xiaohei'; let age = 18; let data = { "info":[{ "name":name, "age":age }] } //请求方式代码 $.ajax({ type: "POST", url: "http://localhost:8000/",
阅读全文
摘要：有时候框架提供的图标并不能够供我们使用，所以我们需要新的图标库来实现 ##阿里妈妈icon库 阿里妈妈icon库 ##项目使用步骤： 在component下面新建一个文件 在文件内写以下代码 <template> <svg :class="svgClass" aria-hidden="true">
阅读全文
