![](https://img-blog.csdnimg.cn/20210610002917269.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
妙思维JS++
跟随小野团队,深入学习
落花流雨
这个作者很懒,什么都没留下…
展开
-
防抖和节流实现原理
防抖或是节流:限制函数的执行次数防抖:通过 settimeout的方式,在一定的时间间隔内,将多次触发变成一次触发<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>防抖和节流</t原创 2020-12-20 17:36:42 · 1024 阅读 · 0 评论 -
Vue2和Vue3开发组件有什么区别
Vue2和Vue3开发组件有什么区别总结:Vue2 与 Vue 3其实概念与理念都是一样的。只是有一些属性获取方式和声名和定义方式稍微变了我觉得 Vue3 给我们前端开发者带来了全新的开发体验,更好的使用弹性,可控度也得到了大大的提升。如果你是一个学过或者接触过 React 然后现在想使用Vue的话,应该特别兴奋,因为很多使用方式都和React非常相近了 !全新的合成式API(Composition API)可以提升代码的解耦程度 —— 特别是大型的前端应用,效果会更加明显。还有就是按需引用的有了转载 2020-08-30 17:44:56 · 917 阅读 · 0 评论 -
基于vue实现单选和多选功能
单选<template> <div class="wrap"> <div class="single"> <ul class="box"> <li v-for="(c,index) in cities" :class="{checked:index==currentIndex}" @click="changeList(index,c)"原创 2020-06-09 00:19:41 · 2091 阅读 · 0 评论 -
vue项目之跨域解决方案
跨域常见解决方案jsonp (项目基本不用)原理:动态生成script标签,通过src属性加载缺点:不支持POST请求,支持get请求应用场景:有些第三方数据接口可能会使用jsonp解决跨域问题,工作中不怎么用。中间服务器代理A前端部署地址:127.0.0.1:8000B中间服务器:127.0.0.1:8000C目标服务器地址:127.0.0.1:8888因为浏览器的同源策略,A 和 c 存在跨域问题,A 无法访问 服务器c解决:因为跨域问题仅存在于浏览器(**服务器请求服务原创 2020-05-15 00:08:51 · 2779 阅读 · 0 评论 -
Vue中v-if和v-for为何不能连用
Vue中v-if和v-for为何不能连用?<div v-for="(item, index) in list" :key="index" v-if="flag">{{ item }}</div>原因分析v-for 会比 v-if优先执行,当一个标签上面同时存在:v-for 和 v-if 的时候,会先执行v-for循环,然后去看循环出来的每个div上面flag的值,是真还是假。如果flag为true,就显示 ,否则就不显示这样就造成了不必要的性能浪费解决方案v-f原创 2021-01-30 11:28:16 · 825 阅读 · 0 评论 -
页面刷新vuex的state数据丢失这么办~
vue单页面应用刷新网页后vuex的state数据丢失的解决方案首先感谢各位博主的分享,参考文章:https://blog.csdn.net/guzhao593/article/details/81435342https://blog.csdn.net/gitchatxiaomi/article/details/1089140881. 刷新页面,vuex的state数据丢失的原因?js代码是运行在内存中的,代码运行时的所有变量、函数也都是保存在内存中的。进行刷新页面的操作,以前申请的内存被释放,转载 2021-01-08 12:47:44 · 614 阅读 · 0 评论 -
使用事件代理:单选按钮 --点击添加样式
事件代理:父子组件传值含义:将子元素的事件通过冒泡的形式交由父元素来执行原理:事件委托是利用事件的冒泡原理来实现的Event对象提供了一个属性叫target,可以返回事件的目标节点,我们称为事件源也就是说,target就可以表示为当前的事件操作的dom,但是不是真正操作dom页面文件<template> <div class=""> <btn-radios :subjects="subjects" /> </div></te原创 2020-09-26 13:23:36 · 293 阅读 · 0 评论 -
前端实现模糊查询
前端实现模糊查询搜索需求:搜索框为空,默认展示下面的搜索历史,隐藏搜索列表如果用户输入搜索内容:有搜索结果展示:搜索结果,没有搜索结果展示:暂无搜索内容点击搜索列表的选项,自动填充到搜索框具体代码如下:工具类:/** * * @param {*} fn * @param {*} delay * * 节流函数throttle:在delay时间内,时间只触发一次 * 防抖函数:在delay时间后,输入完成后多长时间才会触发一次;如果在输入时间内,用户再次输入就会重原创 2020-09-26 11:17:46 · 2883 阅读 · 0 评论 -
过滤器封装 filters
过滤器封装过滤器文件 filters文件路径:src / filters / order.jsexport default { setOrderStatus (status) { switch (status) { case 1: return '待付款'; break; case 2: return '待发货'; break; case 3: return '待收货';原创 2020-08-29 08:56:57 · 341 阅读 · 0 评论 -
基于vue自定义封装 toast组件
自定义toast组件原文首发:https://www.jianshu.com/p/0891ae3a7e6d在这里首先感谢博主的分享,公司项目中需要用到toast组件。利用空余时间,按照博主分享的内容,一步步实现了。以此当做学习记录一下。第一步:在components/新建toast文件夹(存放:toast.vue 和 index.js)toast.vue<template> <div class="wrap" v-if="showWrap" :class="showC转载 2020-06-11 23:22:53 · 718 阅读 · 1 评论