vue
文章平均质量分 70
视黑梦白
这个作者很懒,什么都没留下…
展开
-
vue-修饰符
在处理事件时调用 event.preventDefault() 或 event.stopPropagation() 是很常见的。尽管我们可以直接在方法内调用,但如果方法能更专注于数据逻辑而不用去处理 DOM 事件的细节会更好。为解决这一问题,Vue 为 v-on 提供了事件修饰符。函数进行处理转换为数字,如果用户输入的数据无法被。提供了一些修饰符,用于改变其行为。默认去除用户输入内容中两端的空格。处理,那么将返回原始值。事件变更数据修改为每次。原创 2024-07-13 09:23:22 · 287 阅读 · 0 评论 -
vue-ref与reactive
refref所创建的对象本身不具有响应性,而是将内部值包装在特殊对象中,通过.value访问响应对象。在模板中使用ref时,不需要加.value,会自动解包。ref可以为对象和非对象的普通变量增加响应性。(如果是对象用proxy包装再交给_value属性,如果是非对象的普通变量直接交给_value属性,通过get和set进行依赖收集和发布更新。如果是 shallow ref直接赋值给_value.)ref传递给函数,同时保留对最新值和响应式的连接和访问。ref可以持有任何类型的值,包括深层的对象、原创 2024-07-13 09:22:53 · 194 阅读 · 0 评论 -
vue-计算属性
计算属性默认是只读的。当你尝试修改一个计算属性时,你会收到一个运行时警告。现在当你再运行 fullName.value = ‘John Doe’ 时,setter 会被调用而 firstName 和 lastName 会随之更新。一个计算属性仅会在其响应式依赖更新时才重新计算,无论多少次访问计算属性都会立即返回先前的计算结果,而不用重复执行getter函数。// 注意:我们这里使用的是解构赋值语法。,和其他ref类似,可以通过。原创 2024-07-13 09:21:41 · 196 阅读 · 0 评论 -
vue-模板引用
虽然 Vue 的声明性渲染模型为你抽象了大部分对 DOM 的直接操作,但在某些情况下,我们仍然需要直接访问底层 DOM 元素。要实现这一点,我们可以使用特殊的 ref attribute:ref 是一个特殊的 attribute,和 v-for 章节中提到的 key 类似。它允许我们在一个特定的 DOM 元素或子组件实例被挂载后,获得对它的直接引用。这可能很有用,比如说在组件挂载时将焦点设置到一个 input 元素上,或在一个元素上初始化一个第三方库。原创 2024-07-13 09:20:55 · 384 阅读 · 0 评论 -
vue-侦听器
在setup()和script setup中同步语句的侦听器,会在宿主组件卸载时停止自动停止。(异步创建则不会,必须手动停止,比如定时器中创建侦听器)而一个返回响应式对性的getter函数,只有在返回不同对象时,才会触发回调函数。传入一个响应式对象,就会隐式的创建一个深层侦听器,所有嵌套变更都会触发回调。创建侦听器的返回值是一个函数,调用这个函数即停止对应侦听器。默认是懒执行的:仅当数据源变化时,才会执行回调。我们希望在创建侦听器时,立即执行一遍回调。声明周期内,数据源变更只回调一次。原创 2024-07-13 09:19:27 · 316 阅读 · 0 评论 -
vue-路由自动化
工程中的Router会根据src/views目录结构自动生成路由配置,路由结构与文件系统结构保持一致,不需要手动编写,使得项目结构更加直观和易于理解。原创 2024-07-09 14:04:23 · 577 阅读 · 0 评论 -
mock-前端数据模拟
是一个简单的 Node.js 服务端应用程序,这个工具的主要作用是提供一个模拟的后端服务,可以在前端开发过程中独立于后端进行简单工作。Mock.js 是一个用于生成随机数据的 JavaScript 库,它可以帮助前端开发者在没有后端数据的情况下模拟 API 响应。通过 Mock.js,开发者可以很容易地生成各种类型的数据,如字符串、数字、布尔值、对象、数组、图片等,并且可以自定义数据生成的规则。mock.js有两个作用:1、 产生模拟数据:调用mock接口后直接返回模拟数据。原创 2024-06-21 10:06:36 · 661 阅读 · 0 评论 -
vitest-前端单元测试
可以直接在vite.config.ts中直接对vitest进行配置,也可以新建一vitest.config.ts文件单独对vitest进行配置,如果使用vitest.config.ts单独对vitest进行配置的话,要注意vitest.config.ts会覆盖vite.config.ts中的配置。Vitest提供的功能还有很多,比如报告器、测试覆盖率、测试快照等,以上只提到一小部分,使用vitest达到提升代码质量,提高调试效率,提高代码可维护率的水平,还是需要一定的学习成本的。(it是test的简写)原创 2024-06-19 13:11:42 · 1021 阅读 · 0 评论 -
vite|webpack环境变量-多模式配置
webpack与vite配置几乎一样,不同点如下:(建议vue项目使用vite,原因很多,主要快~)运行测试:npm run staging。Vite 在一个特殊的。对象上暴露环境变量。原创 2024-06-17 10:41:06 · 585 阅读 · 0 评论