20231201 前端开发日报

四年前端裸面，两周拿到美团offer；浅谈前端出现率高的设计模式；妙用computed拦截v-model，面试管都夸我细；用lodash开发前端，真香；做了几年前端，别跟我说没配置过webpack；Nuxt.js：下一代Web开发框架的革命性力量；GitHub 2023排名前十的最佳开源项目；reveal.js：免费、强大的演示框架 | 开源日报 No.89

1. 四年前端裸面，两周拿到美团offer

   你没有办法辨别什么是机会，没有人能长一双慧眼，看到机会的来临。你只能做各种各样的准备，往往是准备之后你做了临时性的选择、不知深浅的决定，正是这些准备，让你的各种选择和决定改变了命运。

2. 浅谈前端出现率高的设计模式

   浅谈前端曝光率高的九大设计模式。分别从创建型：构造器模式、共产模式、单例模式；结构型：适配器模式、装饰器模式、代理模式；行为型：观察者模式、模板模式、命令模式

3. 妙用computed拦截v-model，面试管都夸我细

   如何避免写出屎山，优雅的封装组件，在面试官面前大大加分，从这篇文章开始！ 保持单向数据流 大家都知道vue是单项数据流的，子组件不能直接修改父组件传过来的props，但是在我们封装组件使用v-mode

4. 用lodash开发前端，真香

   前言 在日常的前端开发中，总是涉及到对数据的处理，比如后端返给你一坨数据，你需要进行处理并回显到页面上，又或者提交form表单到服务端时，你需要将数据处理成后端接口定义的数据结构，而这些都离不开数据处

5. 做了几年前端，别跟我说没配置过webpack

   引言 webpack中文官网：https://webpack.docschina.org/concepts/ webpack是一个javascript常用的静态模块打包工具，通过配置webpack，可

6. Nuxt.js：下一代Web开发框架的革命性力量

   文章浏览阅读1.2k次，点赞93次，收藏88次。Nuxt.js是一个基于Vue.js的通用应用框架，它的目标是让Web开发变得更加简单、高效。Nuxt.js提供了一套完整的前端开发解决方案，包括项目脚手架、路由管理、状态管理、服务器端渲染等功能。通过使用Nuxt.js，开发者可以快速地构建出高性能、可扩展的Web应用。

7. GitHub 2023排名前十的最佳开源项目

   开源软件（OSS）彻底改变了当今软件开发的方式。在数百万个开源GitHub项目中，要找到最适合需求的开源项目可能会让人不知所措。 今天给大家列出2023年增长最快的前10个开源GitHub仓库。通过这

8. reveal.js：免费、强大的演示框架 | 开源日报 No.89

   reveal.js 是一个开源的 HTML 演示框架，让您可以通过 web 浏览器免费创建精美的演示文稿。它具有许多强大的功能，包括嵌套幻灯片、Markdown 支持、自动动画、PDF 导出、演讲者备

9. 前端接口容灾

   考虑到需要存储的数据量，5MB 一定不够的，所以选择了 IndexDB。考虑新用户或者长时间未访问老用户，会取不到缓存数据与陈旧的数据。因此准备上云，用阿里云存储，用 CDN 来保障。

10. Flutter 知识集锦 | Dart 枚举已支持属性成员

    在 Flutter3.0 之后，Dart 版本到 2.17 。虽然知道 Dart 枚举已支持属性成员，但一直没有用过。最近刚好有个使用的小场景，就来介绍一下。将以如下的 PopupMenuButton

11. 再也不怕面试官问`watch`、`computed`、`watchEffect`的区别了

    在Vue中，数据响应式是一个核心概念，它使得当数据变化时，相关的视图会自动更新。为了更灵活地处理数据的变化，Vue提供了多种方式，其中包括watch、computed和watchEffect。

12. 前端知识梳理（Vue与JS篇）

    文章浏览阅读363次，点赞9次，收藏6次。在了解深浅拷贝之前我们需要了解一下都有哪些数据类型js中数据类型主要分为两大类：基本数据类型与引用数据类型基本数据类型（值类型）：字符串（String）、数字(Number)、布尔(Boolean)、空（Null）、未定义（Undefined）、Symbol引用数据类型：对象(Object)、数组(Array)、函数(Function)基本数据类型：数据直接存储在栈(stack)中的数据。引用数据类型：地址直接存储在栈(stack)中，真实的数据存储在堆内存中。

13. Vue 和 React 的优点分别是什么？如何选择？

    文章浏览阅读244次。在前端开发的世界中，React和Vue都是非常流行的JavaScript库，它们都提供了许多有用的功能来帮助开发者构建高质量的用户界面。然而，在我个人的开发经验中，相比于React，我更喜欢使用Vue。接下来讲讲我的实践经验。

14. Vue实现图片预览（Viewer.js）

    文章浏览阅读170次，点赞3次，收藏4次。vue项目开发中遇到一个图片预览的需求，可以切换下一张，就是花里胡哨的，所以找viewer.js的插件

15. 9.vue3项目（九）：spu管理页面的新增和修改

    文章浏览阅读453次，点赞10次，收藏8次。spu管理页面的新增和修改

16. 实战Flask+BootstrapTable后端传javascript脚本给前端实现多行编辑(ajax方式)

    文章浏览阅读167次，点赞4次，收藏4次。相信看到此文的朋友们一定会感到庆幸,总之我是用了两天死磕,才得到如下结果,且行且珍惜,祝好各位!相信看到此文的朋友们一定会感到庆幸,总之我是用了两天死磕,才得到如下结果,且行且珍惜,祝好各位!就这些了,如果你有更好的方法,望不吝赐教!话不多说,有图有源码。

17. Vue3-admin-template的表格合计计算

    文章浏览阅读514次。Vue3-admin-template的表格合计计算

18. Vue学习计划–Vue2（二）Vue代理方式

    文章浏览阅读317次，点赞7次，收藏6次。Vue2-代理方式

19. Vue中 实现自定义指令（directive）及应用场景

    文章浏览阅读338次，点赞10次，收藏6次。/ 如果你只需要执行绑定的 bind 和 update 两个事件,vue指令定义也配置了简写方式.})new Vue({router,store,

20. vue 实现鼠标划词翻译功能-鼠标菜单（一）

    文章浏览阅读159次，点赞2次，收藏5次。:selection选择器匹配元素中被用户选中或处于高亮状态的部分。CSS3 ::selection 选择器。main.js 全局注册。

21. vue自定义指令触底加载

    文章浏览阅读157次，点赞2次，收藏5次。【代码】vue自定义指令触底加载。

22. vue-页面滚动加载 及内容滚动在可视区域发送请求

    文章浏览阅读93次，点赞2次，收藏2次。在这个例子中，我们使用 ref 属性来获取 info 元素的引用，并在 mounted 钩子中使用 window.addEventListener 来监听滚动事件。在滚动事件处理函数 handleScroll 中，我们计算滚动条的位置，并将其与可视区高度进行比较。如果滚动条位置大于可视区高度，我们将滚动条位置重置为可视区高度，从而使元素始终保持在可视区中。