自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 uniapp和小程序的区别?

它能够让开发者使用 Vue.js 的语法和组件化开发方式,一次编写代码,即可在多个平台(如微信小程序、App、H5 等)上运行,实现了一套代码多端运行的目标。开发体验: 由于 Uni-app 提供了一套完整的跨平台开发解决方案,使得开发者可以使用相似的语法和工具来开发不同平台的应用,因此在一定程度上简化了开发流程。总的来说,Uni-app 是一个跨平台的应用开发框架,而小程序是一种在特定平台上运行的应用程序,它们在跨平台支持、开发语言、生态系统和开发体验等方面有着明显的区别。

2024-07-01 08:31:20 135

原创 什么是实体符?常见的有哪些?

商标符号:™ -> 通常不是通过单独的实体符表示的,但可以使用™(尽管这不是标准的HTML实体符)或简单地输入™字符。左双引号:“(注意:此符号可能不是直接通过实体符表示的,但在某些上下文中,如HTML,可以使用"来表示双引号)非断行空格: -> (一个或多个连续的 可以表示不同数量的非断行空格)右双引号:”(同样,此符号可能不是直接通过实体符表示的)右单引号:’(同样,可能不是直接通过实体符表示的)版权符号:© -> © 或 ©r;正负号:± -> ± 或 ±。小于号:< -> <大于号:> -> >

2024-07-01 08:29:40 241

原创 HTML 响应式 Web 设计

RWD 指的是响应式 Web 设计(Responsive Web Design)RWD 能够以可变尺寸传递网页RWD 对于平板和移动设备是必需的。

2024-07-01 08:28:34 386

原创 HTML5 内联 SVG

元素的 width 和 height 属性定义 SVG 图像的宽度和高度。注意:由于 SVG 是用 XML 写的,因此所有元素都必须正确关闭!SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失。SVG 图像可在任何的分辨率下被高质量地打印。SVG 用于定义用于网络的基于矢量的图形。SVG 图像可被搜索、索引、脚本化或压缩。SVG 可在图像质量不下降的情况下被放大。SVG 图像以 <svg> 元素开头。

2024-07-01 08:27:08 267

原创 HTML 字符集

它为每个可存储字符定义了一个唯一的二进制数字,以支持 0-9 之间的数字、大写和小写字母(a-z,A-Z)以及特殊字符(比如!提示:当浏览器检测到 ISO-8859-1 时,它通常默认为 Windows-1252,因为 Windows-1252 还有 32 个国际字符。Unicode 联盟开发了 UTF-8 和 UTF-16 标准,因为 ISO-8859 字符集是受限制的,并且不兼容多语言环境。如需更深入的研究,请访问我们的 完整的 ISO-8859-1 参考。早期 Web 的字符编码为 ASCII。

2024-07-01 08:26:02 347

原创 Object.defineProperty()

这是 js 中一个非常重要的方法,ES6 中某些方法的实现依赖于它,VUE 通过它实现双向绑定,此方法会直接在一个对象上定义一个新属性,或者修改一个已经存在的属性, 并返回这个对象。* configurable: 总开关,是否可配置,若为 false, 则其他都为 false(默认为 false)总开关,是否可配置,设置为 false 后,就不能再设置了,否则报错, 例子。* writable: 属性的值是否可被重写(默认为 false)* enumerable: 属性是否可被枚举(默认为 false)

2024-06-21 14:33:10 156

原创 微信小程序的双向数据绑定和vue的哪里不一样?下拉刷新的方式代码示例

在上述代码中,通过scroll-view组件的bindscrolltoupper绑定了refresh事件,在滚动到顶部时触发下拉刷新操作。refresh事件处理函数中,可以执行刷新操作,更新数据和视图,并通过wx.stopPullDownRefresh()方法停止下拉刷新的动画。实现方式:小程序的双向数据绑定采用的是数据劫持的方式,通过重写对象的get和set方法来监听数据的变化和更新视图。语法差异:小程序的双向数据绑定使用的是{{}}语法,将数据绑定到视图上;

2024-06-21 14:27:35 144

原创 react setupProxy.js导致项目无法启动

如果是因为添加了setupProxy.js导致项目无法启动,检查此文件中的如下内容。

2024-06-21 14:26:19 178

原创 小程序从注册到开发的具体流程

开发小程序界面:在小程序项目中,可以使用HTML、CSS、JavaScript等前端技术来开发小程序界面。注册小程序账号:首先需要在微信公众平台注册一个小程序账号,登录微信公众平台后,在开发者工具中选择“小程序”,填写相关信息,提交审核。创建小程序项目:在微信开发者工具中,选择“新建小程序项目”,填写小程序名称、AppID等信息,选择一个本地目录作为项目的保存路径。",并在控制台输出日志"Page loaded."。提交审核:完成开发后,可以在微信开发者工具中选择“上传”按钮,将小程序提交到微信审核。

2024-06-21 14:24:34 132

原创 微信小程序的优劣势

用户只要使用过小程序,就会成为小程序的用户,该小程序会自动进入用户的发现栏小程序列表中,小程序实现了用最低的成本,让产品出现在用户的微信中。小程序只有1M的大小限制(参考文章3中提到1M,但文章1提到2M,可能随时间有所变化),导致无法开发大型复杂的应用。小程序自带的“附近的小程序”功能,帮助商家被五公里范围内的微信用户搜索到,店铺根据距离来排名,与品牌大小无关。小程序自上线以来不断释放新能力,为商家提供了更多的渠道来推广自己的小程序,进而实现店铺及商品的推广交易。

2024-06-17 08:26:56 258

原创 微信小程序的目录结构

project.config.json:项目配置文件,用于记录开发者工具的配置信息,如编辑器的颜色、代码上传时是否自动压缩等。app.json:主配置文件,用于对整个小程序的全局配置,包括小程序的页面组成、窗口背景、导航条样式等。.json:页面的配置文件,用于配置页面的窗口表现、导航条样式等。.wxml:页面的结构文件,用于描述页面的结构,类似于HTML页面。.wxss:页面的样式文件,用于描述页面的样式,类似于CSS文件。.js:页面的逻辑文件,用于处理页面的业务逻辑、监听事件等。

2024-06-17 08:25:12 187

原创 小程序的生命周期

但请注意,小程序的onHide事件不会在用户手动关闭小程序时触发,只会在小程序被自动隐藏或者关闭时触发。挂起与销毁:小程序进入后台状态一段时间后(如5秒),微信会停止小程序JS线程执行,小程序进入挂起状态。如果小程序进入后台并被挂起后,很长时间(如30分钟)都未再次进入前台,或者占用系统资源过高,小程序会被销毁,即完全终止运行。热启动则是指用户已经打开过某小程序,然后在一定时间内再次打开该小程序,此时小程序并未被销毁,只是从后台状态进入前台状态。这个阶段通常用于初始化页面数据,包括从服务器请求数据等。

2024-06-17 08:23:05 188

原创 Composition API的引入

Vue.js 3.x版本带来了许多全局API的调整,其中包括Composition API的引入、全局API的移除和替代、插件机制的改进以及对TypeScript的增强支持。虽然存在一些劣势和适应成本,但总体来说,Vue.js全局API的调整带来了更好的代码组织、可读性和重用性,同时增强了对TypeScript的支持。TypeScript支持的增强:Vue.js 3.x版本提供了更好的类型推断和支持,使得使用TypeScript的开发者能够更准确地编写类型安全的代码,并获得更好的编辑器集成体验。

2024-06-07 10:59:18 346

原创 TS中的枚举是什么如何使用

该示例定义了一个名为 Color 的枚举,其中包含了三个常量:Red、Green 和 Blue。在代码中,我们使用枚举类型 Color 来声明 color 变量,并将其赋值为 Color.Green。我们还使用 Color[4] 来获取枚举值为 4 的常量的名称(即 "Blue")。枚举常量的名称通常使用大写字母和下划线,以便更好地区分常量和变量。枚举可以提高代码的可读性和可维护性,因为它允许开发人员定义并使用有意义的符号名称来表示特定的常量。在手动分配值的情况下,枚举的常量必须是数字类型。

2024-06-03 14:57:45 277

原创 Vue rules校验规则详解

Vue.js 提供了一套轻量级的、可扩展的模板校验规则。这些规则可以通过在v-model绑定中添加.modifier来使用,例如v-model.trim。除了这些内置的校验规则,你还可以使用自定义的校验函数。minLength: 检查值的长度是否大于等于指定的最小长度。maxLength: 检查值的长度是否小于等于指定的最大长度。regex: 检查值是否符合指定的正则表达式。email: 检查值是否符合电子邮件格式。min: 检查值是否大于等于指定的最小值。max: 检查值是否小于等于指定的最大值。

2024-06-03 14:54:31 368

原创 Vue 3 中实现引导页

3 中实现引导页五秒后自动进入首页,并在进入首页时检查用户ID的逻辑setup。

2024-06-03 14:51:38 522

原创 react保留和重置状态

当您给出组件状态时,您可能会认为该状态“存在于”组件内部。React 通过该组件在渲染树中的位置将它所持有的每个状态片段与正确的组件相关联。在 React 中,屏幕上的每个组件都具有完全隔离的状态。例如,如果并排渲染两个组件,则每个组件都将获得自己的独立和状态。React 会保留组件的状态,只要它在 UI 树中的位置被渲染。如果它被删除,或者不同的组件在同一位置被渲染,React 就会丢弃它的状态。这是因为当 React 删除一个组件时,它会破坏它的状态。只要你在树中的同一位置渲染相同的组件,

2024-06-03 14:49:47 451

原创 JSX 有条件地包括

这种风格适用于简单的条件,但要适度使用。如果组件因嵌套条件标记过多而变得混乱,请考虑提取子组件来清理。在 React 中,标记是代码的一部分,因此您可以使用变量和函数等工具来整理复杂的表达式。虽然这种重复是无害的,但它可能会使你的代码更难维护。你必须在代码中的两个地方执行此操作!在这种情况下,你可以有条件地包含一点 JSX,使你的代码更加 DRY。JavaScript 有一个紧凑的语法来编写条件表达式——条件运算符或“三元运算符”。条件(三元)运算符 (?

2024-06-03 14:48:03 300

原创 react 对输入做出反应与状态

对于孤立的示例来说,操作 UI 已经足够好了,但在更复杂的系统中,管理起来会成倍增加。这是另一种思考方式:想象一下,在一辆车里骑在某人旁边,然后轮流告诉他们去哪里。它之所以被称为命令式,是因为你必须“命令”每个元素,从微调器到按钮,告诉计算机如何更新 UI。取而代之的是,你声明了你想要显示的内容,React 会弄清楚如何更新 UI。您无需直接操作 UI 的各个部分,而是描述组件可能处于的不同状态,并在它们之间切换以响应用户输入。在这个命令式 UI 编程的例子中,表单是在没有 React 的情况下构建的。

2024-06-03 14:45:54 482

原创 React 中重新实现强制实施表单

您希望避免状态内容中的重复,因此您只跟踪必要的内容。你的目标是防止内存中的状态不表示你希望用户看到的任何有效 UI 的情况。将所有交互表示为状态更改,可以在以后引入新的视觉状态,而不会破坏现有状态。就像设计人员一样,在添加逻辑之前,您需要为不同的状态“模拟”或创建“模拟”。例如,这里只是表单的视觉部分的模拟。简单性是关键:每个状态都是一个“移动部分”,你希望尽可能少的“移动部分”。然后,需要一个状态变量,表示要显示的视觉状态之一。您知道它们是必不可少的,因为您无法在不破坏功能的情况下删除它们中的任何一个。

2024-06-03 14:44:50 491

原创 react组件使用 antd

前提需要安装react-app-rewired / customize-cra。使用 在App.js文件中引入按钮并使用。需要配置package.json文件。需要引入自己的css文件 模块化。

2024-05-25 23:23:32 127

原创 Vue - 超强实现网页禁止浏览器缩放功能

如图 就是 放大缩小页面都不会影响 布局变化 或说页面不受放大缩小的影响。

2024-05-25 23:20:50 241

原创 react框架对Excel文件进行上传和导出

部分的 以下代码包含有导入excel文件和导出excel文件,读着可以根据需要,自己选择想要实现的功能。第二步,在第一步中导入文件到电脑上面时,在这部分的代码中,添加了。1.首先需要安装xlsx第三方的库库。

2024-05-25 23:18:50 386

原创 el-upload中的before-upload不生效

before-upload是在上传文件时触发,不是添加文件时触发,添加文件时触发 on-change。所以如果我们要在添加文件时,对文件的大小和后缀等等进行判断,可以用 on-change 方法来实现。我们先来看看官方对before-upload的定义。

2024-05-25 23:15:05 150

原创 react 组件表格固定底部

这段代码创建了一个React组件,其中包含一个表格和一个固定在底部的组件。表格内容超出时,可以通过.table-container的overflow-y: auto属性来实现滚动。底部的.footer组件通过CSS的position: absolute和bottom: 0固定在底部。在React中,要实现一个组件表格并且固定底部,可以使用CSS的固定定位或绝对定位来实现。

2024-05-25 23:11:05 216

原创 vue 请求拦截器 的响应拦截器有几种?

以上代码只是示例,具体实现可能需要根据你的项目环境和需求进行调整。例如,Session.get('token')可能需要根据你的状态管理库进行修改。另外,如果你使用的是Node.js,你可能需要使用如node-fetch或axios这样的库来发送HTTP请求。解决方案2:使用fetch的AbortController。的ajaxSetup。

2024-05-25 23:09:19 411

原创 react 用合计项

以下是一个简单的React组件示例,它计算一个商品列表中所有商品的总价。中,如果你想要计算一个数组中的所有项目,你可以使用。这是一个JavaScript内置的。然后在JSX中显示总价。属性,它是一个包含商品信息的数组。,它允许你累计数组中的值。

2024-05-25 23:01:53 289

原创 Vue Router的介绍与引入

说大白话点就是它帮助你根据不同的 url 来展示不同的页面(组件),不用自己写 if / else路由配置影响整个项目,所以建议单独用config目录、单独的配置文件去集中定义和管理。Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成,让用 Vue.js 构建单页应用变得轻而易举。在这里是记录我引入Vue Router的全过程,引入方面也最好先看官方文档。展示由 Vue.js 的过渡系统提供的过渡效果。模块化、基于组件的路由配置。路由参数、查询、通配符。

2024-05-19 23:03:02 156

原创 React中JSX语法入门

通过使用大括号{},可以在JSX中使用任何有效的JavaScript表达式,包括变量、函数调用、算术运算和条件语句等。JSX将HTML标签和JavaScript代码结合在一起,可以在其中使用JavaScript表达式,并且可以通过使用大括号{}来嵌入JavaScript代码。通过使用JSX,我们可以在JavaScript代码中嵌入HTML标记,从而更容易地构建可复用的UI组件。在React中的JSX中,也可以使用任何有效的JavaScript表达式,包括变量、函数调用、算术运算、条件语句等。

2024-05-19 23:01:03 595

原创 高阶组件和Hooks

而使用Hooks,我们可以在函数组件中轻松地管理状态和实现复杂的组件逻辑。性能优化:避免不必要的渲染,使用React.memo进行组件的浅层比较,合理使用shouldComponentUpdate或useMemo来提高性能。通过理解和灵活运用高阶组件和Hooks,以及其他优秀的编码实践,我们可以开发出更加高效、可维护和灵活的React应用程序。要使用高阶组件,您可以将它应用于组件,并将返回的新组件渲染到您的应用程序中。组件化和模块化:将功能拆分成小而独立的组件,使得代码更易于理解、测试和维护。

2024-05-19 22:57:12 1072

原创 React中的页面跳转方式详解

React Router 是 React 官方推荐的路由库,它提供了一些组件,用于管理应用程序的不同页面之间的导航。使用 React Router 可以通过编写简单的代码来实现页面跳转。可以实现在 React 中的页面跳转,但它不是推荐的做法,因为它会刷新整个页面,而不是单独更新组件。组件提供了一种不刷新整个页面的跳转方式。元素的接口,但它不会导致整个页面的刷新。React Router 中的。使用 React Router。组件包裹应用程序,并使用。组件提供了一个类似于。

2024-05-19 22:53:09 302

原创 react使用组件

组件是常规的 JavaScript 函数,所以你可以将多个组件保存在同一份文件中。——我们可以认为 Gallery 是一个 父组件,将每个 Profile 渲染为一个“孩子”。这是 React 的神奇之处:你可以只定义组件一次,然后按需多处和多次使用。<Profile /> 以大写 P 开头,所以 React 知道我们想要使用名为 Profile 的组件。<section> 是小写的,所以 React 知道我们指的是 HTML 标签。组件,你可以在其他组件中使用它。例如,你可以导出一个内部使用了多个。

2024-05-19 22:49:31 167

原创 使用 JSX 书写标签语言

每个 React 组件都是一个 JavaScript 函数,它会返回一些标签,React 会将这些标签渲染到浏览器上。网页是构建在 HTML、CSS 和 JavaScript 之上的。多年以来,web 开发者都是将网页内容存放在 HTML 中,样式放在 CSS 中,而逻辑则放在 JavaScript 中 —— 通常是在不同的文件中!SX 是 JavaScript 语法扩展,可以让你在 JavaScript 文件中书写类似 HTML 的标签。反之,彼此无关的细节是互相隔离的,例如按钮的标签和侧边栏的标签。

2024-05-19 22:47:10 284

原创 传递给组件

每个父组件都可以通过为其子组件提供道具来将一些信息传递给子组件。Props 可能会让您想起 HTML 属性,但您可以通过它们传递任何 JavaScript 值,包括对象、数组和函数。但是你可以将任何道具传递给自己的组件,比如 ,来自定义它们。例如,、、、、和是您可以传递给 :classNamesrcaltwidthheight<img>您可以通过列出它们的名称来阅读这些道具,这些道具在内部和后面用逗号分隔。在此代码中,组件不会将任何 props 传递给其子组件:ProfileAvatar。

2024-05-19 22:44:34 398

原创 React中JSX语法入门

通过使用大括号{},可以在JSX中使用任何有效的JavaScript表达式,包括变量、函数调用、算术运算和条件语句等。JSX将HTML标签和JavaScript代码结合在一起,可以在其中使用JavaScript表达式,并且可以通过使用大括号{}来嵌入JavaScript代码。通过使用JSX,我们可以在JavaScript代码中嵌入HTML标记,从而更容易地构建可复用的UI组件。在React中的JSX中,也可以使用任何有效的JavaScript表达式,包括变量、函数调用、算术运算、条件语句等。

2024-05-12 10:59:33 800

原创 生命周期钩子

onMounted() 也可以在一个外部函数中调用,只要调用栈是同步的,且最终起源自 setup() 就可以。每个 Vue 组件实例在创建时都需要经历一系列的初始化步骤,比如设置好数据侦听,编译模板,挂载实例到 DOM,以及在数据改变时更新 DOM。在此过程中,它也会运行被称为生命周期钩子的函数,让开发者有机会在特定阶段运行自己的代码。还有其他一些钩子,会在实例生命周期的不同阶段被调用,最常用的是 onMounted、onUpdated 和 onUnmounted。下面是实例生命周期的图表。

2024-05-12 10:54:04 228

原创 插槽 Slots

在之前的章节中,我们已经了解到组件能够接收任意类型的 JavaScript 值作为 props,但组件要如何接收模板内容呢?在某些场景中,我们可能想要为子组件传递一些模板片段,让子组件在它们的组件中渲染这些片段。地方渲染各异的内容,但同时还保证都具有相同的样式。(slot outlet),标示了父元素提供的。(slot content) 将在哪里被渲染。组件更加灵活和具有可复用性。(以及相应的样式),而其内部的内容由。

2024-05-12 10:51:46 371

原创 组件 v-model

defineModel() 返回的值是一个 ref。一个名为 update:modelValue 的事件,当本地 ref 的值发生变更时触发。一个名为 modelValue 的 prop,本地 ref 的值与其同步;defineModel 是一个便利宏。它的 .value 和父组件的 v-model 的值同步;当它被子组件变更了,会触发父组件绑定的值一起更新。3.4 开始,推荐的实现方式是使用。声明了一个 prop,你可以通过给。可以在组件上使用以实现。

2024-05-12 10:49:19 211

原创 什么是vue的计算属性?为什么使用?怎么使用?举例说明

它的值是基于其他响应式数据的衍生值,这些值会自动缓存并根据依赖的数据进行更新。当依赖的数据发生变化时,计算属性会重新计算。总之,Vue的计算属性是一个强大的特性,它可以帮助我们更有效地管理视图逻辑和数据变换。性能优化:计算属性内部有缓存机制,只有当依赖的数据发生变化时,才会重新计算。代码复用:如果需要在多个地方使用相同的逻辑,计算属性可以确保逻辑的一致性,并减少代码的重复。简化模板:通过将复杂的逻辑放在计算属性中,模板可以更加简洁和清晰。在计算属性中,可以编写任何逻辑,只要最终返回一个结果即可。

2024-05-11 08:38:41 371

原创 什么是渐进式框架

在 JavaScript 中,我们创建了一个新的 Vue 实例,并通过 el 选项将其挂载到 id 为 app 的元素上。这种方式的好处在于它使得项目的起点低、上手快,同时随着项目的增长,可以逐步引入更复杂的特性,而不需要一开始就全面使用框架的所有功能。然而,Vue.js 的功能远不止于此。你可以根据需要逐步引入更多的 Vue 特性,如组件、指令、过滤器、生命周期钩子、路由、状态管理等。同时,Vue.js 提供了丰富的官方库和社区资源,允许你在需要时逐步扩展功能,如状态管理、路由、构建工具等。

2024-05-11 08:36:51 386

空空如也

空空如也

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

TA关注的人

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