她说她说-CSDN博客

原创前端vue经典面试题78道（重点详细简洁）

2分钟，200-300个字，主旨自己基本情况，工作经历，优点，兴趣爱好，职业规划，邀约为什么要封装组件？主要就是为了解耦，提高代码复用率。什么是组件？页面上可以复用的都称之为组件它是 HTML、CSS、JS 的聚合体。组件就相当于库，把一些能在项目里或者不同项目里可以复用的代码进行需求性的封装。组件中的 data 为什么是一个函数？让每个返回的实例都可以维护一份被返回对象的独立的拷贝。在solt组件中有自己的data，把它传给使用的地方。

2022-08-22 14:43:46 7716 3

原创常用正则表达式

1 . 校验密码强度密码的强度必须是包含大小写字母和数字的组合，不能使用特殊字符，长度在8-10之间。^(?=.*\\d)(?=.*[a-z])(?=.*[A-Z]).{8,10}$2. 校验中文字符串仅能是中文。^[\\u4e00-\\u9fa5]{0,}$3. 校验E-Mail 地址同密码一样，下面是E-mail地址合规性的正则检查语句。[\\w!#$%&'*+/=?^_`{|}~-]+(?:\\.[\\w!#$%&'*+/=?^_`{|}~-]+)*@(?:[\\w

2021-06-18 16:21:29 122

转载时间格式转换

function dateToString(date, format = 'yyyy-MM-dd') { const d = new Date(date); let result = format; const _config = { 'y+': d.getFullYear(), 'M+': d.getMonth() + 1, // 月 'd+': d.getDate(), // 日 'h+': d.getHours(), // 小时 'm+': d.ge

2021-06-17 17:51:20 131

转载如何判断两个对象相等？

法一：当然JSON.stringify(obj)==JSON.stringify(obj)执行速度是最快的JSON.stringify({name:'23423',www:'1313'}) == JSON.stringify({name:'23423',www:'1313'})//trueJSON.stringify({name:'23423',www:'1313'}) == JSON.stringify({mkmk:'2345234'})//false法二：function isSame

2021-06-17 17:11:33 134

原创箭头函数的this 构造函数的this 全局环境下的this各是什么

在非箭头函数下， this 指向调用其所在函数的对象，而且是离谁近就是指向谁（此对于常规对象，原型链， getter & setter等都适用）；构造函数下，this与被创建的新对象绑定；DOM事件，this指向触发事件的元素；内联事件分两种情况，bind绑定， call & apply 方法等，容以下一步一步讨论。箭头函数也会穿插其中进行讨论。全局环境下在全局环境下，this 始终指向全局对象（window）, 无论是否严格模式；...

2021-06-16 16:15:45 130

原创 vue的组件里的定时器要怎么销毁

const timer = setInterval(() =>{// 某些定时器操作}, 500);// 通过$once来监听定时器，在beforeDestroy钩子可以被清除。this.$once('hook:beforeDestroy', () => { clearInterval(timer);})

2021-06-16 14:43:35 336

原创请写出3中判断数组的方法

判断数组还是对象1，isArrayvar arr = []Array.isArray(arr)2，constructorvar arr = []arr.constructor === Array 3，Object.prototype.toString.callvar arr = []Object.prototype.toString.call(arr)"[object Array]"var arr = {}Object.prototype.toString.call(arr)

2021-06-16 09:52:31 96

原创实现文字溢出显示…鼠标移入浮层展示全部

实现逻辑：将文字放到一个容器中，将容器的样式（主要是有关字体的样式）都设置为当前元素的样式，然后获取容器的宽，也就是文字的宽。如果文字的宽度超过了当前元素的宽度，则给溢出隐藏的css样式 overflow :hidden;text-overflow: ellipsis;white-space: normal定义鼠标移入展示浮层，浮层中显示全部内容，鼠标移出销毁浮层。通过自定义指令实现如上思路：Vue.directive('showTips', { // el {element} 当前元素 c

2021-06-15 16:13:58 2017 1

原创 vue组件中this和$el指向

this指向组件的实例，$el用于获取Vue实例挂载的DOM元素，在mounted生命周期中才有效，之前的钩子函数内无效。如下代码所示，Vue脚手架中，$el指向当前组件template模板中的根标签。<template> <div id="root"> <h1 @click="fn()"> Lorem, ipsum </h1> </div></template><script>e

2021-06-15 15:32:20 11409 2

原创什么是Vuex? 为什么要使用Vuex ?vuex使用示例（数据持久化）

在 Vue 项目中，如果项目结构简单，父子组件之间的数据传递可以使用 props 或者 $emit 等方式（详参大神博文《Vue进阶（六）：组件之间的数据传递》）。如果是大型项目，很多时候都需要在子组件之间传递数据，使用之前的方式就不太方便。Vue 的状态管理工具 Vuex 完美的解决了这个问题。首先，我们需要知道 vue 是以单向数据流的方式驱动的。多个视图依赖于同一状态。来自不同视图的行为需要变更同一状态。vuex 类似Redux的状态管理器, 用来管理Vue的所有组件状态，采用集中式存储管

2021-06-11 13:57:02 181 1

原创 vue路由传参的几种基本方式

1、动态路由（页面刷新数据不丢失）路由配置（示例）{ path: '/particulars/:id', name: 'particulars', component: particulars }methods：{ insurance(id) { //直接调用$router.push 实现携带参数的跳转 this.$router.push({ path: `/particulars/${id}`, }) }}

2021-06-11 10:21:38 148 3

原创 vue 插槽的使用

插槽使用 - 具名插槽描述：具名插槽其实就是给插槽取个名字。一个子组件可以放多个插槽，而且可以放在不同的地方，而父组件填充内容时，可以根据这个名字把内容填充到对应插槽中。代码如下：1、子组件的代码，设置了两个插槽(header和footer)：<template> <div> <div class="header"> <h1>我是页头标题</h1> <div>

2021-06-09 14:24:11 190 1

原创 ES字符串操作：遍历、比较、截取、补全...

1.确定一个字符串是否包含在另一个字符串中let s = 'Hello world!'; s.startsWith('Hello') // trues.endsWith('!') // trues.includes('o') // true这三个方法都支持第二个参数，表示开始搜索的位置。 let s = 'Hello world!'; s.startsWith('world', 6) // true s.endsWith('Hello', 5) // true

2021-06-08 14:32:52 2783

原创 addEventListener() 事件监听

语法element.addEventListener(event, function, useCapture);第一个参数是事件的类型 (如 “click” 或 “mousedown”)，详参【事件类型】第二个参数是事件触发后调用的函数。第三个参数是个布尔值用于描述事件是冒泡还是捕获。该参数是可选的。你可以使用函数名，来引用外部函数:element.addEventListener("click", function(){ alert("Hello World!"); });element

2021-06-08 09:56:30 361

原创 show-overflow-tooltip实现表格列内容过长显示提示

在Vue项目中，使用ElementUI显示表格数据时，如果某一个列数值长度超过列宽，会默认换行，造成显示不友好。翻阅Element-UI文档，可发现show-overflow-tooltip列属性可实现列内容过长被隐藏时显示tooltip的功能。注：show-overflow-tooltip属性需要谨慎使用，如果一个页面多列使用，会影响页面加载速度。因为show-overflow-tooltip 属性虽然可以解决文本超长时的问题，但当前是在所有的单元格中插入 tooltip 组件包装来简单实现的。to

2021-06-08 09:35:44 1715

转载 Vue中watch用法

第一种方式<input type="text" v-model="userName"/> //监听当userName值发生变化时触发watch: { userName (newName, oldName) { console.log(newName) }}第一种方式有一个缺点：就是当值第一次绑定的时候不会执行监听函数，只有当值改变的时候才会执行。如果我们想在第一次绑定的时候执行此监听函数，则需要设置immediate为true。比如当父组件向子组件动态传值时，子组件

2021-06-07 17:08:13 192

原创 ES6箭头函数

1.基础语法var fn1 = function(a,b){ return a+b}function fn2(a,b){ return a+b}使用ES6箭头函数语法定义函数，将函数的function关键字和函数名都删掉，使用=>连接参数列表和函数体。代码如下var fn1 = (a,b)=>{ return a+b}(a,b)=> { return a+b}当函数参数只有一个，括号可以省略；但是没有参数时，括号不可以省略。// 无参va

2021-06-03 16:54:03 68

原创 vue中created()与activated()的理解

created()：在创建vue对象时，当html渲染之前就触发；但是注意，全局vue.js不强制刷新或者重启时只创建一次，也就是说，created()只会触发一次；activated()：在vue对象存活的情况下，进入当前存在activated()函数的页面时，一进入页面就触发；可用于初始化页面数据等...

2021-06-02 17:51:43 820

原创面试必备：2021 Vue经典面试题总结

一、什么是MVVM？MVVM是Model-View-ViewModel的缩写。MVVM是一种设计思想。Model 层代表数据模型，也可以在Model中定义数据修改和操作的业务逻辑；View 代表UI 组件，它负责将数据模型转化成UI 展现出来，ViewModel 是一个同步View 和 Model的对象。在MVVM架构下，View 和 Model 之间并没有直接的联系，而是通过ViewModel进行交互，Model 和 ViewModel 之间的交互是双向的，因此View 数据的变化会同步到Model

2021-06-02 16:11:09 664

weixin_43203982的博客