12 2022 档案
摘要：防抖和节流 防抖和节流主要目的就是防止一个事件频繁触发或频繁使用DOM。比如scroll事件，滚动事件通常频繁触发，上一次回调没有执行完，下一次的事件就触发了，导致出现的页面抖动现象。 函数防抖的主要思想是让事件不立即触发 函数节流的主要思想是每次触发后间隔 n 秒后再触发 防抖 让事件不立即触发
阅读全文
摘要：为什么要对会话进行跟踪？ 主要原因是因为 HTTP 请求是无状态的；只有当用户发出请求时，服务器才会做出响应，客户端与服务端之间的联系是离散的、非连续的；如果用户想在同一个网站的多个页面之间转换时，无法确定是否是同一个用户；对会话进行跟踪就是为了解决这样的问题。 常用的会话跟踪技术 token（令牌
阅读全文
摘要：简介 Webpack 主要有五个核心属性 1.Entry 入口(Entry)指示 webpack 以哪个文件为入口起点开始打包，分析构建内部依赖图 2.Output 输出(Output)指示 webpack 打包后的资源 bundles 输出到哪里去，以及如何命名。 3.Loader Loader
阅读全文
摘要：首先说 new，new 是创建实例，常规如下： function a(x){ this.x = x } // 实例化 let b = new a(3) // { x: 3} b.__proto__ a.prototype // true b.__proto__ Object.prototype //
阅读全文
摘要：比如我们想做一个校验，会出现一个弹窗，填写校验信息，此时页面禁止滚动 可以绑定如下事件 change(){ // show 控制弹窗显隐 this.show = !this.show if(this.show){ // pc 端直接删掉滚动条 document.body.style.overflow
阅读全文
摘要：使用 Vue.component 可以用来注册全局组件 // main.js ... import School from "./components/School.vue" Vue.component("School", School) ... // .vue <template> <div> .
阅读全文
摘要：Mock 可以用来模拟服务端响应请求，让前端人员自己测试接口 直接上案例： Axios // request.js import Axios from 'axios' // 先创建一个 axios 实例，无需配置 baseURL，只是模拟后端 const http = Axios.create({
阅读全文
摘要：$attrs 用来保存给子组件绑定了，但子组件没有接收的数据，如下： // 父组件...<School v-bind="{a, b, c}"></School>... // 子组件 School...props: ['a', 'b']... 打印子组件的 $attrs，如下所示： 通常，此属性可以用
阅读全文
摘要：删除数组指定索引的元素可以采用 delete，Array.splice 和 vue.$delete 三种方法 如下所示： let a = [1,2,3,4,5] let b = [1,2,3,4,5] let c = [1,2,3,4,5] delete a[2] b.splice(2, 1) th
阅读全文
摘要：参考官方文档：Axios 中文文档 Axios 和 Fetch 类似，都是基于 Promise ，用来发送网络求请求的 不同的是，Axios 是基于 Ajax 封装的，而 Fetch 是 ES6 中的原生API（这也是Fetch目前来看唯一优于 Axios 的地方，方便测试） Fetch 请移步 F
阅读全文
摘要：vue 通过 provide/inject 钩子可以实现父子组件间通信，父 => 子 父组件通过 provide 向下层组件（子组件、子子组件等等都可以用）提供数据，下层组件使用 inject 注入到当前组件中。 注意： 1.对于基本数据类型，传递的数据不会携带响应式。（可采用函数返回值的方式，使传
阅读全文
摘要：安装及引入 // 安装 npm i vue-router // 引入 main.js ... import VueRouter from "vue-router" import router from './router'... Vue.use(VueRouter) ... new Vue({ ro
阅读全文
摘要：简介 在Vue中实现集中式状态（数据）管理的一个Vue插件，对vue应用中多个组件的共享状态进行集中式的管理（读/写），也是一种组件间通信的方式，且适用于任意组件间通信。 搭建环境 创建主文件，通常为 src/store/index.js。 // src/store/index.js // 引入V
阅读全文
摘要：简述 在使用Axios时，在本地开发通常会出现跨域问题，解决方法也很简单。 在开发环境下，可以通过配置Vue.config.js中的module.exports中devServer来解决。 注：生产环境无效，没见dev打头么，生产环境给axios配置baseURL，打包完给后端解决去 简单配置 直接
阅读全文
摘要：语法 // 回调函数中 this 为当前组件 VueComponent this.$nextTick(回调函数) 作用 在下一次 DOM 更新结束后执行其指定的回调。 这样说其实有点难以理解，DOM更新结束后是什么时候？难道数据变了，DOM没变吗？ 先上代码 <template> <div id="
阅读全文
摘要：消息订阅与发布（pubsub） 一种组件间通信的方式，使用方法和全局事件总线$bus很相近，适用于任意组件间通信。 安装 // 安装 npm i pubsub-js // 引入 import pubsub from 'pubsub-js' 使用 在A组件中： pubsub参数上和$bus略有不同，回
阅读全文
摘要：组件的自定义事件 使用场景 A是父组件，B是子组件，B想给A传数据，那么就要在A中给B绑定自定义事件（事件的回调在A中） 绑定自定义事件 在父组件中： <HelloWorld @customEvent="test1"/> 或 <HelloWorld v-on:customEvent="test1"/
阅读全文
摘要：Props 功能 让组件接收外部传过来的数据 传递数据 <Demo name="xxx"/> 接收数据 1. 第一种方式（只接收）： props:['name'] 2. 第二种方式（限制类型）： props:{ name: String } 3. 第三种方式（限制类型、限制必要性、指定默认值）： p
阅读全文
摘要：插件可用于扩展Vue，自定义插件应包含install方法的一个对象，install的第一个参数是Vue，第二个以后的参数是插件使用者传递的数据。 定义插件: // plugin.jsexport default { install(Vue, x, y, z){ // 传入的第一个参数是Vue, 可以
阅读全文
摘要：vue中的mixin可以实现组件中重复代码的高度复用，可以将不同组件中重复的组件选项（如，data、created、mounted、components、computed、watch等）都提取出来，形成一个mixin的js文件，在需要用到这些代码时，引入这个js文件即可。 用法 通过mixins属性
阅读全文
摘要：概述 Vue生命周期函数主要包含8个部分，按顺序分别是： 1. beforeCreate（创建前）2. created （创建后）3. beforeMount (载入前)4. mounted （载入后）5. beforeUpdate （更新前）6. updated （更新后）7. beforeDes
阅读全文
摘要：除了Vue的内置指令为，vue还支持自定义指令 简单的自定义指令 如下所示： 在directives中创建big方法，传入两个参数： 1 element: 绑定的Dom元素 2 binding: 绑定的对象，其value属性即为绑定变量的值 <div id="root"> <h1 v-big="n"
阅读全文
摘要：常用 v-bind: 单向绑定,可简写为:xxx v-model: 双向绑定 v-for: 遍历数组/对象/字符串 v-on: 绑定事件监听,可简写为@ v-if: 条件渲染(动态节点是否存在) v-show: 条件渲染(动态节点是否展示) 其他 v-text: 渲染文本内容,不会解析标签不能拼接文
阅读全文
摘要：两点注意： 1.function做为返回值再调用时，属于在全局执行，所以this应指向全局 2.箭头函数没有this，故直接向外层找，且因为没有this，所以无法绑定this 第一题： var name = 'window' function Person (name) { this.name =
阅读全文
