![](https://img-blog.csdnimg.cn/ec775aaa038f4886b95b49566f3a996e.jpeg?x-oss-process=image/resize,m_fixed,h_224,w_224)
vue相关
文章平均质量分 56
vue
汤姆比基尼
程序员年二十有四,始从文连考而不中。遂习武练武场上发一矢,中鼓吏逐之出。改学IT自撰一函数,堆栈溢出。
展开
-
【Vue3-Vite】Vite配置--路径别名配置
vue3-vite路径别名配置使用 @ 代替 src,因为 typescript 特殊的 import 方式 , 需要配置允许默认导入的方式,还有路径别名的配置。官方教程: https://cn.vitejs.dev/guide/env-and-mode.html。本地安装 Node 的 TypeScript 类型描述文件即可解决编译器报错。使用 @ 代替 src。原创 2023-09-07 14:43:58 · 1014 阅读 · 0 评论 -
【vue】实现高性能虚拟滚动的Vue代码解析
通过以上的代码分析,我们深入了解了基于Vue实现的高性能虚拟滚动技术。这项技术通过动态计算偏移量和显示的数据范围,使得页面在渲染大量数据时能够保持流畅性。特别是在滚动事件中加入时间间隔判断,进一步优化了滚动性能。虽然本文只是简单介绍了虚拟滚动的实现思路,但它背后的原理和技术值得我们深入学习和探讨。通过这个示例,我们不仅可以提升页面性能,还可以更好地理解前端渲染机制和优化策略。希望本文对你理解和掌握虚拟滚动技术有所帮助!如果你有任何疑问或者想进一步深入讨论,欢迎在评论区留言。原创 2023-08-26 12:16:08 · 860 阅读 · 0 评论 -
【vue】vuex数据丢失怎么办?盘一盘vue传值的方法
全局监听,页面刷新的时候将 store 里 state 的值存到 sessionStorage 中,然后从sessionStorage 中获取,再赋值给 store ,并移除 sessionStorage 中的数据。vuex的 store 中的数据是保存在运行内存中的,当页面刷新时,页面会重新加载 vue 实例,vuex 里面的数据就会被重新赋值,这样就会出现页面刷新vuex中的数据丢失的问题。getter,可以增加一个getter派生状态,(相当于store中的计算属性),用来获得共享变量的值。原创 2023-02-27 13:39:33 · 574 阅读 · 0 评论 -
令人窒息的百度面试题(正值换工作季,还不收藏???)
最近去网上找了一些百度的面经,冥冥之中在众多的面试题中打开了下边两个面试题:2021百度前端社招面经百度前端面试题分享,带答案看完之后我直呼“哇哦~”,全部在我的射程范围之内。我该不会如此幸运到问的全会吧。是的,答案就是不会,我就是没有幸运到全会。话不多说,接下来就回顾下面试题。关于这个问题我写过使用driver.js库和Vue Tour实现的新手指引。使用js实现如下:实现思路是:返回值是一个 [3] 对象,是包含整个元素的最小矩形(包括 padding 和 border-width)。该对象使用 le原创 2023-01-31 13:43:44 · 3150 阅读 · 0 评论 -
vue+element实现气象五参数一览
气象标准五参数(环境温度、相对湿度、风速、风向、大气压力)我调用官方彩云天气接口API服务器的地址:https://api.caiyunapp.com/v2/qdtgU5C6Bhvmmxoa/116.4009,39.9033/forecast.jsonp?callback=?地址中 116.4009,39.9033 为你要获取参数对应的地理位置先上效果图数据都是实时获取,目前根据天气转换图标(晴天太阳等)还没实现使用element中card卡片ui在vue中创建.vue文件内容如下<!原创 2021-05-13 10:48:37 · 1416 阅读 · 0 评论 -
mui里点击input框是为什么会返回顶部?已解决
使用mui后,在body标签上会有(mui-ios mui-ios-9 mui-ios-9-1,)这样的css样式,在页面渲染的时候就加上了,一开始没注意,后来发现。补充:有些select不是click触发,所以事件句柄无效,要在select标签本身添加onfocus事件异步删除。好久以前的一个bug,我试了各种取消默认事件,依旧会返回顶部。还有就是这个bug是chrome浏览器特有的,其他浏览器就没有(360浏览器就正常)mui中填写表单的时候点击input会返回顶部?当然也可以直接加到body里。原创 2022-02-23 16:56:03 · 1187 阅读 · 1 评论 -
【vue】仿淘宝商品详情---实现滚动显隐标签页&锚点导航
封装成组件复用的话,首先快捷键的每一项数据需要父组件传入;在父组件定义一个数组作为右侧导航栏的数据;由于左侧区域的某一块内容没有数据时,其对应的导航项不显示;要给每一块的内容最外层绑定ref,是为了获取该dom元素,通过点击导航栏某一项时,让页面可以滚动到对应的元素内容;导航在抽屉里做的,给最外层绑定ref=“drawer”,可以获取到当前页面最外层的dom元素,根据最外层容器的dom元素来获取滚动高度;组件要接收导航栏数据、接收当前是否是抽屉(默认为抽屉,传false为普通正常页...原创 2021-11-08 14:50:17 · 1862 阅读 · 2 评论 -
vue中实现token过期后退出登录,定时退出
设置路由全局守卫permassion.js并且引入到main.js中main.js中引入import './permassion' // 你的全局路由守卫文件路径permassion.js内容在全局路由中调用监听token的setstorage.jsimport router from './router'import store from './store' // 调取vueximport setStorage from '@/router/component/storage' /原创 2021-08-20 15:24:37 · 3028 阅读 · 0 评论 -
vue实现点击空白处改变dom状态实现显隐
说明:最近在写h5项目文章回复功能,给出需求是,点击回复的默认按钮,出现带输入框和发布按钮的div代替当前,当焦点失去的时候隐藏盒子(本来想在输入框焦点问题动手的,但是想到滑动文章内容就失去焦点隐藏有点不太好),效果图如下:初始状态下:点击后,并且滑动文章不会消失,点击文章内容即可隐藏实现代码:<div ref="searchMain" class="box-footer"> // 这里一定要绑定ref(searchMain) <div v-show="e原创 2021-08-20 10:23:32 · 443 阅读 · 0 评论 -
让DIV的滚动条自动滚动到最底部scrollTop
制作一个在线聊天的程序,在做最后的修饰时,需要对获得的信息即时滚动以保证用户总能看到最新消息。聊天程序是基于websocket设计的,消息容器是一个DIV,所以问题就在于如何控制DIV的滚动条。这里推荐一个好用的一个平台(如流):http://hi.baidu.com/chen1345789/blog/item/de727bfb45587b176d22eba1.html让滚动条自动有新信息滚动到底部首先请求websocket// test 是vue里封装的axios请求--params为带参t原创 2021-08-12 11:33:03 · 1832 阅读 · 0 评论 -
vue如何根据返回的值对元素进行样式渲染
vue如何根据返回的值对元素进行样式渲染 1、最终显示样式:需要:根据任务状态值,显示不同颜色的原点表示任务状态,以及对优先级的数据,进行☆标记 2、代码实现: 在<el-table-column>中需要显示的内容前面,添加图标元素,并添加对应的class样式。 其中,addclassStatus以及addclassPriority两个方法是自己定义的计算,根据属性值计算class样式的方法3、在vue中的 export defau........原创 2021-03-25 16:39:48 · 1302 阅读 · 0 评论 -
vue.js是否可以取代jquery
1.在vuejs中是否还需要jquery 如果你作为前端有一段时间的话一定会很熟悉jquery,作为前端的开发神器我们无法想象没有jquery将会写多少繁琐的原生js。在angularjs,react,vue当道的年代里,或许你不在需要jquery了。 当你刚开始使用vue的时候,你很有可能想“如果我用jquery的做的话这将非常简单”,或许这是因为刚接触vue的你还没有了解他。1.操作DOM 使用j原创 2021-02-24 16:29:27 · 4938 阅读 · 1 评论 -
django 与 vue 的完美结合
django 与 vue 的完美结合 最近接到一个任务,就是用django后端,前段用vue,做一个普通的简单系统,我就是一搞后端的,听到vue也是比较震惊,之前压根没接触过v...原创 2021-01-15 11:07:07 · 2820 阅读 · 0 评论 -
深度刨析vue组件&路由
vue核心知识——组件篇 1.vue中子组件调用父组件的方法 第一种方法是直接在子组件中通过this.$parent.event来调用父组件的方法。 <template> <div> <child></child> </div></template><script> import child from './child'; export default {原创 2021-01-15 10:07:20 · 185 阅读 · 0 评论 -
vue脚手架不同版本的区别和介绍
目录 vue-cli 命令 项目结构 设置环境变量 (一)vue-cli 命令 1. vue-cli下载安装: vue-cli2: npm install vue-cli -g vue-cli3/cli4: npm install -g vue@cli 2. 创建新项目 vue-cli2: vue init webpack 2.0project vue-cli3/cli4: vue create 3.0project 或通过视图创建项目:vue ui 3. 启动项目 .原创 2020-12-11 10:26:07 · 4945 阅读 · 0 评论