07 2020 档案
摘要：所谓动态组件就是让多个组件使用同一个挂载点，并动态切换。 is 用法 通过使用保留的 <component></component> 元素，动态地绑定到它的 is 特性，我们让多个组件可以使用同一个挂载点，并动态切换。根据 v-bind:is="组件名" ，组件名就会自动去匹配对应的组件，如果匹配不
阅读全文
摘要：题目： http 常见的状态码有哪些？ http 常见的 header 有哪些？ 什么是 Restful API？ 描述一下 http 的缓存机制（重要） http 状态码 状态码分类 1xx 服务器收到请求 2xx 请求成功，如 200 3xx 重定向（到某一个地址不被允许，重新定向到另一个地址，
阅读全文
摘要：知识点：cookie，localStorage，sessionStorage cookie 本身用于浏览器和 server 端通信 被“借用”到本地存储来 可以使用 document.cookie='...' 来修改 cookie的内容为 key=value;的形式，document.cookie
阅读全文
摘要：题目 手写一个简易的ajax 跨域的常用实现方式 知识点 XMLHttpRequest 状态码 跨域：同源策略，跨域解决方案 ajax核心API-XMLHttpRequest 手写原生Ajax请求 // get 请求 // 初始化ajax实例 const xhr = new XMLHttpReque
阅读全文
摘要：第一种方法: main.js router.afterEach((to,from,next) => { window.scrollTo(0,0); }); 第二种方法： 在创建router实例时，做如下的配置 savedPosition当且仅当通过浏览器的前进/后退按钮触发时才可用 scrollBe
阅读全文
摘要：在安装 nprogress 进度条插件时，控制台报错：npm install ERR! ... 解决方法 方法一： 直接删掉 package-lock.json 文件，然后再次运行 npm install --save nprogress 命令即可安装成功。关于 package-lock.json
阅读全文
摘要：nprogress 插件是在页面刷新和跳转时出现在浏览器顶部的进度条，它会随着页面的加载而显示进度状态。可在官网 查看相关效果。 在vue项目中使用 nprogress 插件 1.安装：npm install --save nprogress 2.在 src → utils 文件夹下创建 nprog
阅读全文
摘要：事件绑定和事件冒泡 题目 编写一个通用的事件监听函数 描述事件冒泡的流程 无限下拉图片列表，如何监听每个图片的点击 知识点 事件绑定 事件冒泡 事件代理 事件绑定 通过 addEventListener(type, fn) 进行事件绑定，下面为事件绑定函数简单封装 // 通用的事件绑定函数 func
阅读全文
摘要：BOM(Browser Object Model，浏览器对象模型) 题目： 如何识别浏览器的类型？ 分析拆解url各个部分？ 知识点： navigator（浏览器信息） screen（屏幕尺寸信息） location（地址栏信息） history（历史信息-前进/后退） 通过 navigator.u
阅读全文
摘要：从JS基础到JS-web-API JS 基础规定 JS 语法，它是ECMA262组织规定的。 JS-web-API 是用于网页操作的API，它是由W3C规定的。 前者是后者的基础，两者结合才能真正实际应用。 js基础知识： 变量的类型和计算 原型和原型链 作用域和闭包 异步操作... JS-web-
阅读全文
摘要：如何使用 ElementUI 自定义分页呢？ 尽管ElementUI比较全面的提供了分页，但实际开发中的需求是多种多样的。比如我需要把下图中的下拉选择每页的数据条数，换成可以手动输入的形式，并且把他的位置放到前往xx页的左边位置。 实现代码如下： <!-- 分页 --> <el-pagination
阅读全文
摘要：在使用 elementUI 的 el-cascader 级联选择框进行省市联动效果时，有这么一个需求：该级联选择框一共有三级结构分别为国家-省份-城市，国家和省份为必选项，城市为可选项。具体实现如下： el-cascader 设置最后一级可选 可通过 props.checkStrictly = tr
阅读全文
摘要：今天遇到了一个需求：进行级联选择框的表单验证，突然有点懵逼。感觉应该和正常的表单验证类似，但不是很清晰，后来还是在博客园找到了相关参考文章。 先上代码： <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100
阅读全文
摘要：遇到个问题就是其中有个要展示的数据来自接口返回的两个字段。 原用法是： 原以为prop=" "中只能放一个字段的数据,想放两个字段数据的话，要把 <el-table-column></<el-table-column> 标签再用 <template></template> 标签包裹才行如下： <el
阅读全文
摘要：el-table表格的代码： <template> <el-table :data="tableData" style="width: 100%"> <el-table-column prop="date" label="日期" width="180"> </el-table-column> <el
阅读全文
摘要：最近在实习工作中遇到了一个需要问题：将后台返回的省市区 json 数据格式化以便前端渲染。这个问题真的是缠绕了我好几天，有思路但是思路特别模糊，今天终于解决了。 返回的数据格式如下： [ { "children": [ { "children": [ "东城区", "西城区", ... ], "na
阅读全文
摘要：<el-form :model="form" :rules="rules"> <el-form-item prop="input"> <el-input v-model="form.input"></el-input> </el-form-item> </el-form> 如上面的代码 1、标签绑定
阅读全文
摘要：获取远程代码并在本地切换到一个新分支修改后,想要 push 到远端与原来不同的新分支，可以使用下面的命令实现： git push origin 本地分支:远端希望创建的分支 上面的本地分支 是基于拉取的远程代码新建的新分支 例如git下来的分支为master git branch >>> *mast
阅读全文
摘要：ElementUI是一款非常强大的前端UI组件库，它默认定义了很多美观的样式，但是我们在实际开发过程中不可避免地遇到需要修改ElementUI默认样式。下面总结了几种修改默认样式的方法。 1. 新建全局样式表 新建 global.css 文件，并在 main.js 中引入。 global.css 文
阅读全文
摘要：1. 需求说明 在前端开发中，往往会遇到页面需要实时刷新数据的情况，给用户最新的数据展示。 2. 逻辑分析 如果需要数据实时更新，我们自然是需要使用定时器，不断的调用接口数据，会相对的消耗内存。 3. 代码示例 data(){ return { intervalId:null } }, method
阅读全文
摘要：用法概述 所有的现代浏览器都支持 JSON 对象，有两个非常有用的方法来处理 JSON 格式的内容： JSON.parse(string) 接受一个 JSON 字符串并将其转换成一个 JavaScript 对象。 JSON.stringify(obj) 接受一个 JavaScript 对象并将其转换
阅读全文
摘要：本文记录实现文本溢出显示省略号的几种方式。 单行文本 三行CSS代码实现： overflow: hidden; // 文本溢出隐藏 text-overflow: ellipsis; // 显示省略号 white-space: nowrap; // 设置文本不换行 注意： 设置文本溢出显示省略号时必须
阅读全文
摘要：git是当前最流行的版本控制系统，下面简单记录一下git的安装及其与远程仓库的关联。 git安装 打开git官网，下载对应的安装包。 双击运行安装包，安装过程中可以直接选择默认配置，一路next下去。 安装过程相对简单，在此不再赘述。可以参考这篇文章 git与远程仓库关联 1.用户配置 git安装完
阅读全文
摘要：更多关于修改ElementUI样式的方法，可以参考这篇文章 1.删除style标签中的 scoped 属性 <style lang="lang" scoped> ... </style> 2.在对应el-form-item的label属性中加入class样式 <el-form-item label=
阅读全文
摘要：本文主要用来记录我在使用vsCode中的一些个人习惯设置。 编辑器主题配置 主题我是用的是 escook-theme，这是我在看某视频教程时发现的一款看起来非常友好的vsCode主题。 文件图标主题 Material Icon Theme 这个用的人数还是挺多的，看起来也是很好的。 关闭编辑器右侧的
阅读全文
摘要：我们在使用官方提供的npm源安装各种依赖包的时候，下载速度会很慢，通常需要更换npm源。 我们可以在终端中输入命令 npm config list 来查看 npm 源地址，默认地址为 metrics-registry = "https://registry.npmjs.org/" 国内常用的npm源
阅读全文
