防抖和节流? 防抖: 事件被触发一定时间后再执行回调,如果在这段时间里再次触发,则重新计算时间。节流: 在一定的时间内只触发一次函数,若单位时间内多次触发,则只会执行一次。防抖和节流都是用来减少函数执行的频率,以达到优化项目性能和特定功能的效果。在src/untils/common.js中封装防抖和节流。在vue项目中如何实现。主要都是用到了定时器。
简述vue生命周期,以及每个周期做的事情? 在vue组件实例被创建后,会经历一系列初始化过程,例:数据观测,模板编译,挂载实例到dom上,以及数据变化时,更新dom数据。父beforeCreate->父created->父beforeMount->子beforeCreate->子created->子beforeMount->子mounted->父mounted。组件挂载之前,vue实例的el和data都已初始化完成,还未挂载到真实dom节点上。vue实例的数据对象data可访问,还未挂载到DOM上,el还没有。问题二:父子组件的生命周期触发顺序?
watch和computed的区别与选择? computed具有缓存性,依赖项没有改变时,是不会重新计算。常用方式,传递一个函数,执行其他操作,watch没有返回值,但可以执行异步操作等复杂逻辑。计算属性是第一次加载就开始监听,watch是默认第一次不监听。计算属性常用场景是简化行内模板的复杂表达式,模板中出现太多逻辑会使模板变得不宜维护。侦听器常用场景是,侦听到状态改变后,执行其他的dom操作或者异步操作。选择何种方案,是判断是否派生出新值,能用计算属性就优先使用计算属性。思路:定义->使用场景的差异,如何选择->注意事项。
v-if和v-for的哪个的优先级更高 在vue2中,v-for的优先级高于v-if。如果一起使用,是先执行循环,再执行判断。也就是说,哪怕只渲染很少一部分元素,也会在每次重新渲染的时候遍历整个列表,浪费性能。1.避免渲染本应隐藏的列表,可以在外层套一层<template></template>,在template中进行v-if判断。再vue3中,v-if的优先级高于v-for,由于v-if执行的时候,调用的变量还不存在,所以会报错。2.过滤列表中的数据;实际使用过程中,v-if和v-for是不能同时使用的。思路:结论->细节->实际情况。
相对路径和绝对路径 相对路径:相对于某个位置的路径,需要有路径的参照物绝对路径:完整的描述文件位置的路径就是绝对路径。(从树形目录结构的根目录开始)实际使用中更推荐使用相对路径。例子:在overview.html中,需要引用overview.css文件绝对路径:admin/css/admin.css相对路径:...
vue 父子组件传值 1.父组件向子组件传值props中定义子组件接收参数title、contain定义类型以及默认值//子组件child<template> <div class="child-contain"> <div>{{msg}}</div> <div>{{title}}</div> <div>{{contain}}</div> </div></templa
如何在vue项目中直接读取本地excel文件中的数据 1.安装并在使用的界面引入XLSXnpm install xlsx//demo.vue界面<script>import XLSX from 'xlsx'</script>2.获取本地文件信息,因为xlsx是后端访问的,所以需要用aixos请求去得到获取后的数据其中url是本地文件路径,放在public中 url:/demo.xlsxreadExcelFile(url) { Axios.get(url,{responseType:'arr
vue-cli3 项目中引入iconfont图标 1.https://www.iconfont.cn/在网站中新建一个项目2.将图标加入该项目中3.选择添加至项目-选中你新建的项目4.下载至本地5.解压后6.在项目-src-assets中新建文件夹icon,将解压后的文件放进去7.修改iconfont.css文件这里方括号内的icon-map就是一开始新建项目时的前缀[class^="icon-map"],[class*=" icon-map"]/*这里有空格*/{ font-f
在vue-cli3中引入百度地图 1.在index.html中加入<head><script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak==秘钥"></script></head>秘钥的获取百度地图api-控制台-应用管理-我的应用将AK复制到上方2.新建一个vue.config.js文件 防止出现BMap is undefined的问题//vue.config.js