自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(48)
  • 收藏
  • 关注

原创 uni-app 引入高德地图

icon: 'https://webapi.amap.com/theme/v1.3/markers/n/mark_b.png', // 自定义图标(可选)​。AMapUI: { version: '1.1', plugins: ['geo/DistrictExplorer'] }, // 可选UI组件​。mapStyle: 'amap://styles/light' // 地图样式(浅色主题)​。// 地图定位到搜索结果​。

2025-04-25 16:55:37 453

原创 ECharts 地图开发入门

{name: '湖北', value: 6812}, {name: '广东', value: 2305},​。{name: '河南', value: 1273}, {name: '浙江', value: 1244},​。tooltip: { formatter: '{b}:{c} 例' }, // {b}省份名,{c}数值​。range: ['#b3e0ff', '#409eff', '#0059b3'], // 颜色范围​。map: 'china', // 指定地图名称(需与引入的地图数据匹配)​。

2025-04-25 16:52:58 706

原创 uniapp 常用开发技巧与实战指南

掌握 uniapp 的核心组件特性、跨平台适配策略和性能优化技巧,能够有效提升多端开发效率。建议开发者定期查阅官方更新文档,关注组件市场的优质插件(如 uView、ColorUI)。在 CSDN 发布技术文章时,注重内容结构清晰、案例完整,通过合理的 SEO 优化提升传播效果。如果需要某部分内容的深度解析(如状态管理集成、第三方 SDK 接入),欢迎在评论区留言,后续将推出专项技术教程。

2025-04-25 16:50:42 299

原创 HBuilder X:前端开发的终极生产力工具

HBuilder X 以「轻如编辑器,强如 IDE」的设计理念,融合极速性能、多端开发、生态扩展三大核心优势,成为前端开发者从效率工具到生产力平台的首选。其「开箱即用」的轻量化设计降低入门门槛,「深度扩展」的插件生态适配复杂场景,结合持续迭代的性能优化与跨平台能力,已服务全球超 900 万开发者,助力企业级项目高效落地。HBuilder X 提供轻量化绿色发行包(仅 10 余 MB),支持 Windows、macOS、Linux 全平台。

2025-04-20 21:36:14 968

原创 快速下载Node.js

Node.js 彻底改变了 JavaScript 的应用边界,使其从浏览器走向服务器和终端。其高性能、易扩展的特性使其成为后端开发的热门选择,搭配 NPM 生态和 VS Code 开发工具,可快速构建现代化应用。Node.js 是基于 Chrome V8 引擎的开源 JavaScript 运行时,允许开发者使用 JavaScript 构建服务器端应用、命令行工具和分布式系统。它以事件驱动、非阻塞 I/O 模型著称,适合开发高性能、可扩展的网络应用。

2025-04-20 21:27:51 674

原创 如何下载——VS Code:轻量级代码编辑器的开发利器

Visual Studio Code(VS Code)是一款由微软开发的免费开源代码编辑器,支持多种编程语言,适用于前端、后端及全栈开发。它以轻量级、高效性和强大的扩展性著称,被全球开发者广泛使用。

2025-04-20 21:26:57 228

原创 局部路由守卫

局部路由守卫为我们提供了更细粒度的路由控制,允许我们在特定的路由或组件级别添加鉴权和逻辑处理。局部路由守卫分为path守卫和component守卫,它们分别适用于不同的场景。path。

2025-04-13 13:53:03 225

原创 全局后置守卫与标题栏切换

在单页面应用(SPA)中,用户在不同页面间切换时,页面标题的动态更新能显著提升用户体验。全局后置守卫是实现这一功能的理想选择,它不仅能确保标题与当前页面内容相符,还能用于记录用户行为,为后续的用户画像构建提供数据支持。

2025-04-13 13:52:12 189

原创 全局前置守卫与购物车页面鉴权

是全局前置守卫,每次路由切换前都会执行。若要访问购物车页面且用户未登录,就会跳转到登录页面;若已登录或者访问的不是购物车页面,就正常放行。在很多应用里,并非所有页面都能随意访问。例如购物车页面,用户需先登录才能查看。这时可以利用全局前置守卫来实现这一鉴权功能。全局前置守卫的书写位置在。对象之前添加鉴权代码。

2025-04-13 13:50:34 250

原创 深挖 TypeScript 基础数据类型:应用与陷阱

在 TypeScript 的学习与实践过程中,对基础数据类型的深入理解和正确运用,是写出高质量代码的关键。本篇文章会通过探讨数据类型在实际场景中的应用,分析常见错误,帮助大家提升运用 TypeScript 基础数据类型的能力。通过留意函数参数、返回值以及对象属性的类型,规避常见错误,开发者能更高效地使用 TypeScript 开发高质量应用。若尝试传入非number类型的参数,TypeScript 编译器会报错,防止运行时错误的出现。// 错误使用,字符串类型不匹配​。// 正确做法,进行null检查​。

2025-04-06 20:05:07 257

原创 TypeScript 类型系统详解

TypeScript 支持丰富的基础数据类型,涵盖number、string、boolean、null、undefined、symbol以及bigint。这些类型为构建可靠的代码提供了基石。在实际编码中,正确使用基础数据类型不仅能增强代码的可读性,还能借助 TypeScript 的类型检查机制,提前发现潜在错误,提升代码质量。

2025-04-06 20:03:16 464

原创 初见TypeScript

TypeScript 由微软开发,它本质上是 JavaScript 的超集,为 JavaScript 添加了静态类型系统,让开发者在编码阶段就能发现潜在类型错误,提升代码质量,使代码更具可维护性。以变量声明为例,JavaScript 中声明变量无需指定类型,而 TypeScript 能让开发者为变量、函数参数和返回值指定类型。上述代码中,let message: string声明了一个类型为string的变量message,避免给message赋值非字符串类型数据,降低运行时错误风险。定义数组有两种方式。

2025-04-06 20:02:07 610

原创 vue3 响应式系统指南

通过合理运用这些响应式 API,可以在保证数据正确性的同时显著提升应用性能。建议根据具体场景选择合适的响应式方案,在深度响应与性能开销之间找到平衡点。用于创建仅跟踪顶层值变化的响应式引用。当需要处理大型对象但只关心顶层属性变化时,可显著提升性能。创建仅第一层属性响应式的对象。

2025-03-29 14:19:25 785

原创 Vue3的声明式路由传参

避免通过 URL 参数传递密码、token 等敏感信息。对于需要 SEO 的页面,优先使用动态参数(

2025-03-29 14:10:00 437

原创 下载和初步上手Vue3路由

只作用于当前路由,用于该路由的特定权限验证。组件内守卫用于在组件内部处理路由相关的逻辑,如在进入、更新、离开组件时执行特定操作。当哈希值发生变化时,会触发回调函数,我们可以在回调函数中获取当前的哈希值并进行相应的操作。在路由守卫中可以根据这些元信息进行相应的验证,确保用户有足够的权限访问目标路由。路由守卫用于在路由切换的不同阶段执行特定的逻辑。则是路由出口,它会根据当前的路由匹配情况显示对应的组件。组件来生成路由链接,用户点击链接时会跳转到指定的路由。获取目标路由的哈希值,并进行相应的处理。

2025-03-29 14:04:14 907

原创 Vue3 基础语法指南:响应式系统与 Ref 应用

功能点Setup 函数ReactiveRef作用组件逻辑入口深度响应式对象灵活响应式变量适用场景所有组合式 API 使用复杂对象状态管理基础类型 / 简单对象管理性能考量优先使用组合式 API对象层级越深越推荐基本类型优先特殊能力访问 props/context自动依赖收集模板引用通过合理运用这些特性,可以构建出更高效、更易维护的 Vue3 应用。

2025-03-21 19:39:48 265

原创 Vue3 基础语法指南:Setup 函数详解

【代码】Vue3 基础语法指南:Setup 函数详解。

2025-03-21 19:37:40 182

原创 下载与快速上手 NVM:Node.js 版本管理工具

graph TDA[执行where node] --> B{输出NVM路径?B -->|是| C[验证成功]B -->|否| D[检查旧版Node.js残留]E[执行nvm version] --> F{显示版本号?F -->|是| G[版本验证通过]F -->|否| H[修复环境变量]I[执行node -v] --> J{版本正确?J -->|是| K[完整验证通过]J -->|否| L[重新执行nvm use]截至2025年3月21日本方法仍然可用。

2025-03-21 19:33:17 651

原创 Vuex 高级技巧与最佳实践

【代码】Vuex 高级技巧与最佳实践。

2025-03-15 21:14:57 343

原创 Vuex 核心功能与组件通信

【代码】Vuex 核心功能与组件通信。

2025-03-15 21:14:20 148

原创 Vuex 基础概念与环境搭建

Vuex 是实现数据集中式状态管理的插件。所有组件共享 Vuex 中的数据,当任意组件修改数据时,其他组件会同步更新。

2025-03-15 21:12:51 309

原创 组件通讯 - Props 机制详解

Props 是 Vue 组件实现单向数据流的核心机制,用于组件间的数据传递与接收。:简单声明(无类型校验)

2025-03-09 13:24:23 551

原创 认识vue2脚手架

package.json:包的说明书(包的名字,包的版本,依赖哪些库)。所以main.js文件的名字不要随便修改,main.js文件的位置不要随便动。第二种:在vue.config.js文件中进行脚手架的默认配置。-- 当浏览器不支持JS语言的时候,显示如下的提示信息。如果用单字母表示组件的名字,会报错,名字应该由多单词组成。脚手架默认配置在vue.config.js文件中进行。main.js、index.html等都是可以配置的。-- 开启移动端虚拟窗口(理想视口) -->-- 设置页签图标 -->

2025-03-09 13:07:24 541

原创 VUE2脚手架的下载与安装

Vue的脚手架(Vue CLI: Command Line Interface)是Vue官方提供的标准化开发平台。它可以将我们.vue的代码进行编译生成html css js代码,并且可以将这些代码自动发布到它自带的服务器上,为我们Vue的开发提供了一条龙服务。Vue CLI注意:Vue CLI 4.x需要Node.js v8.9及以上版本,推荐v10以上。

2025-03-09 13:04:01 970

原创 vue模版语法

{{可以写什么}}

2025-02-28 16:44:58 867

原创 Vue的data配置项

<title>模板语句的数据来源</title>-- 引入Vue -->

2025-02-28 16:35:08 917

原创 Vue程序下载

Vue是一个基于JavaScript(JS)实现的框架,想要使用它,就得先拿到Vue的js文件Vue官网Vue2:Vue.jsVue3:Vue.js - 渐进式 JavaScript 框架 | Vue.js下载并安装vue.js第一步:打开Vue2官网,点击下图所示的“起步”:第二步:继续点击下图所示的“安装”第三步:在“安装”页面向下滚动,直到看到下图所示位置:第四步:点击开发版本,并下载第五步:安装Vue使用script标签引入vue.js文件。就像这样:<script src=”xx/vu

2025-02-28 16:31:24 944

原创 Vue中的数据代理与数据劫持

创建Vue实例vm,vm身上会有_data属性,_data通过劫持data配置项,再通过defineProperty的getter和setter,得到的响应式的数据。把vue中的data数据拦截改写成具有getter和setter形式的_data,就是数据劫持。数据代理vm中_data中的数据又通过数据代理(也是通过defineProperty的getter和setter实现),放置到vm身上,vm可以通过getter方法,setter方法直接使用_data中的数据,方便书写数据。

2025-02-28 16:27:34 491

原创 js的数据代理机制

vm这个Vue实例上可能会出现_xxx或$xxx属性, 而这个属性名可能会和Vue框架自身的属性名冲突。通过访问 代理对象的属性 来间接访问 目标对象的属性。注意:代理对象新增的这个属性的名字 和 目标对象的属性名要一致,这样我们访问代理对象属性,就像在访问目标对象的属性一样。// 实现数据代理,目的是读取 myvm.name == options.data.name。// 如果要实现数据代理机制的话,就需要给proxy新增一个name属性。// 读取对象的属性值 对象[变量]-- vue程序 -->

2025-02-28 16:26:24 480

原创 object.defineProperty()方法

Object.defineProperty(给哪个对象新增属性, '新增的这个属性名叫啥', {给新增的属性设置相关的配置项key:value对})// true表示该属性是可以遍历的。//return this.name //递归,死循环。//this.name = val //递归,死循环。// 给上面的phone对象新增一个color属性。// false表示该属性是不可以被删除的。// false表示该属性是不可遍历的。// true表示该属性是可以被删除的。// 这是一个普通的对象。

2025-02-28 16:22:21 232

原创 HTTP简介

HTTP 即 “hypertext transport protocol”,也就是超文本传输协议。该协议详细定义了浏览器与万维网服务器之间进行通信的规则,就像是双方交流时遵循的一种约定。

2025-02-15 18:03:42 386

原创 原生 AJAX

AJAX 是 “Asynchronous JavaScript And XML” 的缩写,即异步的 JavaScript 和 XML 技术。借助 AJAX,我们能在浏览器里向服务器发送异步请求。它最大的优势在于可以不刷新整个页面就能获取数据,实现按需请求,进而提升网站性能。需要注意的是,AJAX 并非一种新的编程语言,而是把现有的一些标准组合起来使用的新方法。注册账号时:在注册页面输入信息,系统会发送 AJAX 请求来检查输入内容是否符合预设要求,然后返回相关提示信息。电商网站数据加载。

2025-02-15 18:00:50 395

原创 在 Windows 系统上下载和安装 Node.js

在该页面上,你会看到两个版本可供选择:LTS(长期支持版)和 Current(最新版)。一般来说,推荐选择 LTS 版本,因为它更加稳定,相对于最新版不容易出现问题。点击对应 Windows 系统的安装包链接(.msi 格式),根据你的系统是 32 位还是 64 位来选择合适的版本。下载完成后,找到下载的安装包文件并双击运行。如果分别输出版本号,则表示安装成功。安装完成后,打开命令提示符(按下。安装完成后,同样可以使用。

2025-02-15 17:56:05 332

原创 ES5购物车(静态

<input type="checkbox" name="" value="" id="selectAll" /> 全选按钮

2025-02-08 14:16:50 752

原创 ES6购物车示例(静态

<input type="checkbox" name="" value="" id="selectAll" /> 全选按钮1</span>件商品,共计 <span id="amount">100

2025-02-08 14:09:17 530

原创 js购物车(移动端

合计:<i class="total" id="AllTotal">00.00</i>去结算</a> -->" class="settlement">去结算

2025-02-08 13:53:22 890

原创 const 关键字和其与let的区别

但对于复合类型的数据(主要是对象和数组),变量指向的内存地址,保存的只是一个指向实际数据的指针,const只能保证这个指针是固定的(即总是指向另一个固定的地址),至于它指向的数据结构是不是可变的,就完全不能控制了。const实际上保存的,并不是变量的值不得改动,而是变量指向的那个内存地址所保存的数据不得改动。const声明的常量不可以改变,这意味着,const一旦声明,就必须立即初始化,不能以后再赋值,当然数组和对象等复合类型的变量,变量名不指向数据,而是指向数据所在的地址。3) 不允许重复声明。

2025-02-02 11:46:38 310

原创 let关键字

/ 报错,初始化前不能访问a,也就是在同一个作用域中,不可以访问,再定义。//在fn作用域没有,还是会向上寻找。// if else while for 这些语句里,都是有块级作用域的。//作用域链:内层作用域 ——> 外层作用域 ——> 全局作用域。//2. 块儿级作用域 避免暴露成全程作用域,影响别人。// let star = '余老师';//1. 变量不能重复声明,防止变量被污染。// let song = '恋爱达人';// let star = '王老师';// 5、let暂时性死区。

2025-02-02 11:45:28 245

原创 js常用事件表

某个键盘按键被按下时触发,通常不会触发事件冒泡,除非特别处理‌。某个键盘按键被松开时触发(document,window)当鼠标指针移至元素之上时运行脚本,不可以阻止冒泡。当鼠标指针移至元素之上时运行脚本,可以阻止冒泡。当鼠标指针移出元素时运行脚本,不可以阻止冒泡。当鼠标指针移出元素时运行脚本,可以阻止冒泡。某个键盘按键被按下时触发,会触发事件冒泡。当滚动元素的滚动条时运行脚本。当按下鼠标按钮时运行脚本。当松开鼠标按钮时运行脚本。当鼠标指针移动时运行脚本。当转动鼠标滚轮时运行脚本。当单击鼠标时运行脚本。

2025-02-02 11:40:11 175

原创 用js制作鼠标移入指定元素后产生下拉框的效果

我的淘宝</p>,根据需要可以在js代码中添加过度效果让成品效果更好。<p class="mybao">我的淘宝</p><p>已买宝贝</p><p>我的足迹

2025-01-25 19:06:10 251

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除