- 博客(24)
- 收藏
- 关注
RSS订阅原创 深入理解Rem适配：实现移动端与桌面端的一致性布局
Rem适配作为一种解决之道，可以让我们在不同的设备上实现一致性的布局效果。本文将详细介绍Rem适配的原理，并通过代码实例进行解释。但本文所介绍的Rem适配原理和方法，可为开发者提供一个基本的参考和指导。Rem（root em）是一种相对单位，用于解决不同设备上字体大小、间距等问题。当需要实现移动端与桌面端的一致性布局时，我们可以先统计桌面端的字体大小、间距等数据，然后将这些数据转换为Rem单位，最后在移动端进行适配。首先，我们需要统计桌面端html、body的字体大小，以及其他需要适配的元素的大小和间距。
2024-01-01 11:45:00
954
原创 如何在Vue 3项目中实现响应式布局
这样，我们就完成了 Vue 3 项目中的响应式布局实现。根据不同的屏幕尺寸，侧边栏和内容区域的宽度会自动调整。当屏幕宽度小于 768px 时，内容区域将根据屏幕宽度进行调整；当屏幕宽度小于 992px 时，侧边栏将占据整个屏幕宽度。3. 在 `src/components` 目录下，创建一个名为 `ResponsiveLayout.vue` 的组件，该组件将负责实现响应式布局。
2023-12-31 17:00:00
2829
原创 Vue 3 和服务器端渲染（SSR）
在这篇文章中，我们介绍了 Vue 3 及其在服务器端渲染（SSR）方面的应用。通过使用 `vue-server-renderer` 库，我们实现了一个简单的 SSR 应用，提高了网站的性能和 SEO 效果。SSR 能够在不牺牲性能的前提下，提高网站的搜索引擎优化（SEO）效果，并减少内容到达时间（time-to-content）。本文将介绍 Vue 3 及其在服务器端渲染（SSR）方面的应用，通过代码示例展示如何实现 SSR，提高网站性能和 SEO 效果。一、Vue 3 与 SSR。
2023-12-31 13:30:00
1455
原创 Vue3全家桶之——Pinia状态管理
是一个专为Vue 3设计的现代化状态管理库，为Vue 3开发的，它提供了一种简单、可扩展和类型安全的方式来管理应用程序的状态。与Vue 2中的Vuex相比，Pinia提供了更好的TypeScript支持，具有更好的类型定义和类型推断，可在编译时捕获错误，提供更高的代码可靠性和开发体验。它是专为Vue 3设计的，充分利用了Vue 3的新特性，如，以提供更直接、自然和灵活的状态管理体验。Pinia的核心概念是Store，它类似于Vuex中的模块，用于管理应用程序的状，可以将相关的状态和逻辑组合到单个。
2023-12-30 12:45:00
1847
1
原创 探索Sass：现代CSS预处理器的力量
Sass（Syntactically Awesome Style Sheets）是一种现代化的CSS预处理器，它使用类似于Python的语法规则，让你能够编写更简洁、易读的CSS。Sass作为一种现代化的CSS预处理器，凭借其简洁的语法、丰富的功能和强大的表达能力，已经成为前端开发者的必备工具。通过本文的介绍，希望你能对Sass有更深入的了解，并在实际项目中尝试使用Sass，提升自己的开发效率。通过实例代码展示Sass的语法特点和优势，帮助你更快地掌握和实践Sass。6. 循环（For循环和Each循环）
2023-12-30 09:45:00
398
1
原创 vue移动端个人中心地址管理
将获取到的addressid通过：id赋值到每个元素，实现每个元素对应它自己的id，为元素添加data-* 属性（点击了解data-*属性），方便获取到checked的信息，然后为每个radio添加class方便我们设置点击以后的图片切换，根据v-if判断该条地址信息是否为默认地址，在元素上添加了点击事件并传入site（每条地址的相关信息），和该地址信息dom对象。下面是修改默认地址的方法：实现了点击选中和取消，并且点击切换后立即向服务器提交数据实现实时的数据更新。
2023-12-29 21:42:48
474
1
原创 搭建vue3+vite+vant移动端项目
如何使用前端技术搭建一个移动端项目。我们将使用Vue3作为前端框架，Vite作为构建工具，以及Vant作为移动端UI组件库。
2023-12-29 21:26:53
2787
1
原创 express路由中间件
这样，我们可以根据不同的URL路径，将请求分类并交由相应的处理函数来处理。例如，一个处理文章的路由可以是。Express中的中间件可以用来进行请求和响应的预处理、路由验证、错误处理等操作。它可以在处理请求之前或之后执行一系列操作，对请求进行检查、修改响应、调用下一个中间件等。xpress框架是一个基于Node.js的Web应用程序框架，它提供了简单、快速的方式来构建Web应用程序和API。在构建博客时，Express提供了路由和中间件功能，使得我们可以更加灵活地管理请求和处理应用程序的不同功能。
2023-12-11 15:00:00
124
1
原创 模块化commonjs
CommonJS是一种用于组织JavaScript代码的模块化规范，它解决了JavaScript在模块化方面的一些问题，使得代码可以更好地组织、维护和重用。本文将介绍CommonJS规范的背景、特点以及如何在Node.js环境下使用它。
2023-12-09 10:45:00
54
原创 ECMAScript 6（ES6）
ECMAScript 6，也被称为 ECMAScript 2015，是 JavaScript 语言的一次重大更新。它引入了一系列新的语法和功能，以改善开发人员的工作流程和代码质量。在 JavaScript 中，let、const 和 var 都可以用来声明变量。它们有一些相似之处，但也有一些重要的区别。
2023-12-08 14:15:00
81
原创 了解 npm：JavaScript 包管理器的全面指南
npm 是 Node 包管理器（Node Package Manager）的缩写，它是一个用于共享、发布和管理 JavaScript 代码包的工具。除了用于安装第三方模块之外，npm 还可以用来管理项目中的依赖关系、运行脚本命令以及共享自己编写的代码包。
2023-12-08 10:30:00
189
原创 文件fs介绍
当谈到Node.js中的文件操作时，我们必须提到fs模块。fs模块提供了许多用于文件操作的功能，包括读取文件、写入文件、更改文件权限等。下面是fs模块中一些常用功能的介绍以及相应的代码示例。
2023-12-07 18:15:00
98
1
原创 vue生命周期，表单
在处理表单和生命周期时，可能会遇到一些常见问题，比如表单验证、生命周期钩子的执行顺序等。在这些情况下，可以通过合理地使用表单验证库、熟悉生命周期钩子的执行顺序等来解决问题，确保表单的正确性和生命周期逻辑的合理性。在实际项目中，我们通常会使用表单来收集用户输入的数据，然后根据生命周期钩子来处理数据的初始化、提交、销毁等操作。这些生命周期钩子为我们提供了在不同阶段执行自定义逻辑的机会，比如在实例创建完成后获取数据、在实例销毁前清理资源等。Vue 实例有一个完整的生命周期，包括创建、挂载、更新和销毁等阶段。
2023-12-01 15:45:00
79
1
原创 vue事件处理，列表处理，条件处理
Vue.js中的事件处理机制非常灵活，通过v-on指令可以监听DOM事件，并执行相应的处理函数。下面我们将逐个介绍事件处理机制中的各个方面。
2023-12-01 11:15:00
115
1
原创 深入理解Vue计算属性与监听、类与样式绑定
Vue.js是一款流行的JavaScript框架，专注于构建用户界面和单页面应用。它具有以下特点和优势：轻量级：Vue.js的核心库只有几十KB，因此加载速度快，对于移动端和性能要求较高的项目非常适用。双向数据绑定：Vue.js支持双向数据绑定，当数据发生变化时，视图会自动更新，同时视图的变化也会反映到数据上，简化了数据和界面的交互。组件化开发：Vue.js鼓励组件化开发，将页面拆分成多个独立的组件，每个组件负责自己的视图和逻辑，便于复用和维护。
2023-11-30 19:30:00
171
原创 JavaScript 对象详解
JavaScript 对象是一种强大的数据类型，它具有动态性和灵活性，能够存储和操作复杂的数据结构。通过不同的创建方式和操作方法，可以满足各种需求。了解对象的特点、创建方法和访问方式，对于理解 JavaScript 的面向对象编程以及进行前端开发非常重要。希望本篇博客能够帮助你深入理解 JavaScript 对象，并在实际项目中灵活应用。如有任何疑问或需要进一步了解，请随时提问或查阅相关文档和资源。
2023-11-01 11:41:55
71
原创 ECharts：数据可视化利器
ECharts（Enterprise Charts）是一个由百度开发的强大的数据可视化库。它提供了丰富的图表类型、交互式特性和灵活的配置选项，使得开发者可以轻松地创建出美观、功能强大的可视化图表。ECharts支持常见的图表类型，如折线图、柱状图、饼图、雷达图等，同时还提供了更复杂的图表类型，如热力图、散点图、地图等。无论你需要展示简单的数据趋势，还是呈现复杂的地理信息，ECharts都能满足你的需求。如果你对ECharts感兴趣，可以访问ECharts官方网站。
2023-11-01 11:32:28
108
原创 使用jQuery简化前端开发
在前端开发中，jQuery是一种流行且强大的JavaScript库。它提供了许多实用的功能和简化了DOM操作。这篇博客将介绍一些常用的jQuery技巧和最佳实践，帮助读者更加高效地开发前端项目。一、什么是jQueryjQuery是一个流行的JavaScript库，它简化了HTML文档操作和交互效果的开发，提供了简洁的语法和丰富的功能，使开发者能够更快速、高效地创建交互性和动态性的网页。
2023-11-01 11:18:43
157
原创 GitHub介绍以及如何在GitHub上寻找项目
GitHub是一个基于Git版本控制系统的代码托管平台，它提供了一个集中式的代码仓库和协作工具，使开发者能够方便地共享、协作和管理代码。你可以在GitHub上搜索"awesome"关键词，然后加上你感兴趣的领域或技术，例如"awesome python"，GitHub会返回与之相关的Awesome项目列表。创建仓库：登录后，你可以创建一个新的仓库来存储你的代码。社交网络：GitHub是一个开放的社交网络平台，开发者可以关注其他开发者、项目和组织，以便获取最新的动态和参与到感兴趣的项目中。
2023-10-24 15:16:49
414
原创 深入了解npm：前端开发的必备工具
引言： 在现代前端开发中，npm（Node Package Manager）已经成为了无可替代的工具。作为一个强大的包管理器，npm不仅提供了丰富的开源包供我们使用，还能够帮助我们管理项目依赖、构建工具链以及发布自己的包。本文将深入探索npm的功能和应用，帮助读者更好地了解和利用这个工具，提升自己的前端开发效率 npm是Node Package Manager的缩写，是一个用于管理Node.js包和模块的工具。它是Node.js平台的默认包管理器，也是世界上最大的开源软件注册表之一。npm的重要性体现在以下
2023-10-23 11:54:38
299
1
原创 web前端项目
在点击登录按钮时，同样使用`preventDefault`方法阻止默认提交行为，并获取到登录表单中的手机号码输入框和密码输入框的值，并打印到控制台上。这段代码主要是一个登录注册页面的交互逻辑。首先，通过`getElementById`和`querySelector`方法获取到页面上的一些元素，如登录按钮、注册按钮、两个表单和容器。接下来，通过`addEventListener`方法给两个表单添加了提交事件监听器，并使用`preventDefault`方法阻止表单的默认提交行为，以便后续自定义处理。
2023-10-19 18:40:17
176
1
原创 web前端layui介绍
Layui是一款简单易用、功能丰富的前端UI框架，它采用了模块化的设计理念，提供了丰富的组件和API接口，使得前端开发变得更加简单和高效。2. 模块化设计：Layui使用了模块化的设计理念，将功能划分为独立的模块，每个模块都有自己的功能和接口，开发人员可以根据需要加载所需的模块，减少了不必要的代码冗余。（2）模块化设计：Layui使用了模块化的设计理念，将功能划分为独立的模块，每个模块都有自己的功能和接口，开发人员可以根据需要加载所需的模块，减少了不必要的代码冗余。二、Layui的使用方法。
2023-10-19 18:40:04
521
1
原创 关于Bootcdn介绍
BootCDN是一个开源的前端开发资源加速服务，通过全球多个节点服务器分发资源，提供快速、稳定的前端资源加载方式。BootCDN基于CDN（内容分发网络）技术，通过将前端资源部署在全球各地的服务器上，使得用户可以从离自己最近的服务器获取资源，从而提高资源加载速度和用户体验。1. 加速资源加载：BootCDN通过全球多个节点服务器分发资源，可以加速前端资源的加载速度，提高用户体验。2. 资源版本管理：BootCDN支持多个版本的前端资源，开发者可以根据自己的需求选择合适的版本进行加载。
2023-10-19 18:39:50
2979
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人