- 博客(35)
- 收藏
- 关注
RSS订阅原创 微信小程序的常用事件的用法
bindtap 或 catchtap：点击事件，当用户点击某个元素时触发。bindinput 或 catchinput：输入事件，当用户在输入框中输入内容时触发。bindchange 或 catchchange：选择改变事件，当用户选择不同的选项或者切换开关状态时触发。bindsubmit 或 catchsubmit：表单提交事件，当用户提交表单时触发。bindscroll 或 catchscroll：滚动事件，当页面滚动时触发。
2024-06-23 19:55:58
469
原创 小程序view的属性和用法
微信小程序中的 view 组件具有多种属性，用于控制其样式、行为和交互。class / style: 控制视图的样式。hover-stay-time: 控制悬停时的样式和行为。data-xxx: 自定义数据属性，可在 JavaScript 中访问。bindtap / catchtap: 绑定点击事件。animation: 指定动画效果。hidden: 控制视图是否隐藏。控制滚动行为。selectable: 控制文本是否可选中。
2024-06-10 20:40:41
872
原创 小程序中Button组件属性和用法
简要介绍Button组件在小程序中的作用和重要性，以及为什么开发者需要深入了解其属性值和用法。size：设置按钮尺寸大小。type：设置按钮样式类型。plain：设置按钮是否镂空。disabled：设置按钮是否禁用。open-type：设置按钮的开放能力。hover-class：设置按钮按下后的样式类。form-type：设置按钮在表单中的功能类型。lang：设置开放能力的语言类型。hover-stop-propagation：设置是否阻止事件冒泡。
2024-06-02 19:06:18
1693
原创 小程序标签
在微信小程序中，常用的标签包括 、、、、、、、、 和 等。这些标签可用于创建不同类型的视图元素、接收用户输入、播放音视频等功能。通过合理运用这些标签，可以构建出丰富多样的页面和交互效果。
2024-05-26 16:28:31
619
原创 vue路由守卫
在Vue Router中，activated和deactivated是两个钩子函数，用于处理路由的激活和停用。它们允许我们在路由切换时执行一些操作，比如数据的加载和卸载、动画效果的处理等。下面我们来看一下它们的具体作用：activated路由守卫：当导航到该路由时触发。在activated守卫中，我们通常会执行一些需要在路由激活时进行的操作，比如数据的加载、页面的初始化等。deactivated路由守卫：当离开该路由时触发。
2024-05-19 18:19:14
410
原创 vue-库
作为一个Vue.js开发者，使用组件库是提高效率和代码重用的关键。Vue的组件库为开发者提供了一系列预先构建好的组件，可以在项目中直接引用和定制。
2024-05-12 18:52:18
759
原创 【无标题】
作为一个Vue.js开发者，使用组件库是提高效率和代码重用的关键。Vue的组件库为开发者提供了一系列预先构建好的组件，可以在项目中直接引用和定制。
2024-05-06 09:00:00
737
原创 本地存储and自定义事件
Vue CLI项目中，自定义事件用于在组件之间通信。-- 父组件 --> < template > < div > < h1 > 自定义事件示例 < ChildComponent @myCustomEvent = " handleCustomEvent " />
2024-05-05 21:57:35
808
原创 过度与动画
n e x t T i c k 是 V u e . j s 提供的一个方法，用于在 D O M 更新之后执行特定的操作。当我们需要确保 V u e 实例已经更新了 D O M ，例如修改了数据或者更新了组件的状态之后，再执行一些操作，就可以使用 nextTick是Vue.js提供的一个方法，用于在DOM更新之后执行特定的操作。
2024-04-21 16:28:12
851
原创 创建到销毁
Vue生命周期提供了丰富的钩子函数，允许开发者在不同阶段插入自定义逻辑，从而更好地控制组件的行为。通过深入理解Vue生命周期的各个阶段，开发者可以更加高效地开发和维护Vue应用。在编写Vue组件时，应根据具体需求合理使用生命周期函数，避免滥用，以确保代码的可读性和可维护性。
2024-04-14 15:06:32
1747
原创 vue.js基础必备技能
Vue.js 是一款流行的前端框架，具有简洁、高效的特点，为开发者提供了丰富的功能和工具。在 Vue.js 中，列表渲染、数据监视与收集表单数据、过滤器是常见且重要的技能，让我们逐一来了解它们。在 Vue.js 中，您可以使用 v-for 指令来进行列表渲染，即循环遍历数组或对象并渲染相应的元素。在上面的示例中，我们通过 v-for 指令遍历名为 items 的数组，并将每个元素的 name 属性渲染为一个列表项。Vue.js 提供了响应式数据绑定的能力，即当数据发生变化时，相关的 DOM 会自动更新。您
2024-04-07 16:34:46
304
原创 基本事件处理
除了原生DOM事件外，Vue还支持自定义事件，在组件之间进行通信和数据传递。通过e m i t 和 emit和emit和on方法，我们可以在父组件中触发自定义事件，并在子组件中监听和处理这些事件。// 父组件中触发自定义事件// 子组件中监听并处理自定义事件// 处理事件数据});除了Vue提供的预定义事件修饰符外，我们还可以自定义事件修饰符来满足特定需求。// 全局注册自定义按键修饰符// 将F4键码注册为115。
2024-03-31 10:57:48
718
原创 Vue绑定样式条件渲染内置指令自定义指令
Vue框架提供了多个内置指令和自定义指令，它们可以用于处理DOM操作、数据绑定、事件处理等。下面我将简要介绍一些常用的内置指令以及自定义指令的用法。自定义指令允许开发者根据需求创建具有特定行为的指令，以实现更复杂的交互效果。< div v-custom-directive = " ' 参数' " > 自定义指令的使用 < div v-custom-directive = " ' 参数' " > 自定义指令的使用
2024-03-24 18:27:43
355
原创 CSS音频和视频属性和用法
1.**object-fit：**该属性用于调整视频元素的内容适应其容器的方式。**contain：**保持视频的宽高比，将视频缩放至完全适应容器，可能会在视频周围留有空白区域。2.**object-position：**该属性用于定义视频元素在容器中的位置。**cover：**保持视频的宽高比，将视频缩放至完全覆盖容器，可能会导致部分视频被裁剪。**fill：**将视频拉伸以填充容器，可能会导致视频的宽高比被破坏。**none：**保持视频的原始大小，可能会导致视频显示超出容器。6.布局调整与层叠效果。
2024-03-17 20:11:29
714
原创 如何创建 Vue 应用
createApp API 允许你在同一个页面中创建多个共存的 Vue 应用，而且每个应用都拥有自己的用于配置和全局资源的作用域。应用实例必须在调用了 .mount() 方法后才会渲染出来。.mount() 方法应该始终在整个应用配置和资源注册完成后被调用。同时请注意，不同于其他资源注册方法，它的返回值是根组件实例而非应用实例。我们传入 createApp 的对象实际上是一个组件，每个应用都需要一个“根组件”，其他组件将作为其子组件。如果你使用的是单文件组件，我们可以直接从另一个文件中导入根组件。
2024-03-09 21:22:32
422
原创 CSS3的常用样式
在网页设计中，CSS是一种强大的样式表语言，可以为网页添加各种各样的样式和效果。而CSS3作为CSS的第三个版本，引入了许多新的样式属性和用法，为我们提供了更多创意和自由度。本文将介绍一些CSS3中常用的样式属性和用法，帮助您更好地掌握这些技巧。
2024-01-14 12:40:18
768
1
原创 ES6数组的属性和用法
Array.from()：将类似数组的对象或可迭代对象转换为真正的数组。Array.of()：创建一个数组，并将传递给它的值作为元素插入该数组中。Array.prototype.fill()：将数组的所有元素用指定的值填充。Array.prototype.find()：返回数组中第一个满足指定条件的元素。Array.prototype.findIndex()：返回数组中第一个满足指定条件的元素的索引。Array.prototype.includes()：检查数组中是否包含指定元素。
2024-01-07 13:53:56
392
1
原创 Node.js的读取和写入
当我们使用Node.js开发应用程序时，经常需要读取或写入文件内容。Node.js提供了一个fs模块，其中包括一些用于文件操作的方法。本篇博客将讲解fs模块中的readFile和writeFile方法，以及它们的使用方法和注意事项。
2024-01-01 20:25:35
395
原创 flex布局
容器默认存在两根轴：水平的主轴（main axis）和垂直的交叉轴（cross axis）。采用Flex布局的元素，称为Flex容器（flex container），简称”容器”。它的所有子元素自动成为容器成员，称为Flex项目（flex item），简称”项目”。flex-flow属性是flex-direction属性和flex-wrap属性的简写形式，默认值为row nowrap。默认情况下，项目都排在一条线（又称”轴线”）上。flex-direction属性决定主轴的方向（即项目的排列方向）。
2023-12-23 07:00:00
1603
1
原创 transition
animation-name 指定要绑定到选择器的关键帧的名称animation-duration 动画指定需要多少秒或毫秒完成animation-timing-function 设置动画将如何完成一个周期animation-delay 设置动画在启动前的延迟间隔。animation-iteration-count 定义动画的播放次数。animation-direction 指定是否应该轮流反向播放动画。
2023-12-17 18:27:43
382
1
原创 jq的css中的样式
需要注意的是，使用 .css() 方法设置的样式直接作用于元素的 style 属性，会直接修改元素的行内样式。如果想要在多个元素之间共享样式，可以考虑使用 CSS 类来管理样式，并使用 jQuery 的 .addClass() 和 .removeClass() 方法来添加或移除类。请注意，这只是使用 jQuery 的一种方式来设置元素的样式。在现代 Web 开发中，更多的开发者选择使用原生 JavaScript 的方法来操作元素的样式，例如使用 .style 属性直接访问和设置元素的样式。
2023-12-10 18:56:17
483
1
原创 js的字符串用法和属性
获取指定位置的字符编码：可以使用 charCodeAt() 方法获取指定位置的字符的 Unicode 编码。查找子串：可以使用 indexOf() 方法或者 includes() 方法来查找子串在字符串中的位置。提取子串：可以使用 substring()、slice() 或者 substr() 方法来提取子串。访问字符：可以使用方括号加索引或者 charAt() 方法来访问字符串中的特定字符。替换子串：可以使用 replace() 方法来替换字符串中的子串。
2023-11-19 18:35:52
68
原创 es6中的class类
使用ES6类，我们可以更好地组织和管理代码，提高代码的可读性和可维护性。它还支持面向对象编程的核心概念，如继承、多态等，使得代码的设计更加灵活和可扩展。
2023-11-12 19:29:57
25
1
原创 过渡和动画
animation-name 指定要绑定到选择器的关键帧的名称animation-duration 动画指定需要多少秒或毫秒完成animation-timing-function 设置动画将如何完成一个周期animation-delay 设置动画在启动前的延迟间隔。animation-iteration-count 定义动画的播放次数。animation-direction 指定是否应该轮流反向播放动画。
2023-11-05 21:01:33
22
1
原创 弹性盒子的属性和用法
弹性盒子布局（Flexbox）是 CSS3 提供的一种新的布局模式，它可以更加简单、灵活地实现页面的布局，主要用于解决传统布局方式中水平居中、垂直居中、等高列等问题。弹性盒子布局具有以下特点：1.父容器可以指定为弹性盒子布局。使用 display: flex;将一个块级元素设置为弹性盒子容器，就能使用弹性盒子布局。2.子元素可以根据需求自由伸缩，首先弹性盒子容器会把它们所有的子元素作为一个整体来处理，并根据不同的属性来调整这个整体内部的子元素的尺寸。
2023-10-31 21:46:32
63
1
原创 CSS3 弹性盒子(Flex Box)
弹性盒子由弹性容器(Flex container)和弹性子元素(Flex item)组成。弹性容器通过设置 display 属性的值为 flex 或 inline-flex将其定义为弹性容器。弹性容器内包含了一个或多个弹性子元素。display;display;width;height;;.flex-item;width;height;margin;</</</</</</</</也可以修改排列方式。
2023-10-15 17:39:21
40
1
原创 JavaScript let 和 const
使用 var 关键字重新声明变量可能会带来问题。var x = 10;// 这里输出 x 为 10var x = 2;// 这里输出 x 为 2// 这里输出 x 为 2let 关键字就可以解决这个问题，因为它只在 let 命令所在的代码块 {} 内有效。var x = 10;// 这里输出 x 为 10let x = 2;// 这里输出 x 为 2// 这里输出 x 为 10。
2023-10-15 14:29:44
28
1
原创 CSS3渐变
默认情况下，渐变的中心是 center（表示在中心点），渐变的形状是 ellipse（表示椭圆形），渐变的大小是 farthest-corner（表示到最远的角落）。rgba() 函数中的最后一个参数可以是从 0 到 1 的值，它定义了颜色的透明度：0 表示完全透明，1 表示完全不透明。rgba() 函数中的最后一个参数可以是从 0 到 1 的值，它定义了颜色的透明度：0 表示完全透明，1 表示完全不透明。下面的实例演示了从左上角开始（到右下角）的线性渐变。下面的实例演示了从顶部开始的线性渐变。
2023-10-06 17:25:31
417
1
原创 input属性
sessionStorage - 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。localStorage - 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除。保存数据：localStorage.setItem(key,value);删除单个数据：localStorage.removeItem(key);得到某个索引的key：localStorage.key(index);删除所有数据：localStorage.clear();checkbox 复选框。
2023-09-17 13:55:40
32
1
原创 HTML5
HTML5不基于SGML（Standard Generalized Markup Language 标准通用标记语言），因此不需要对DTD（DTD 文档类型定义）进行引用，但是需要DOCTYPE来规范浏览器行为。article --- 内容标签。nav --- 导航标签。footer --- 尾部标签。section --- 块级标签。header --- 头部标签。aside --- 侧边栏标签。controls视频的播放控件。
2023-09-09 14:44:23
39
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人