vue3 2024
文章平均质量分 86
vue3 2024
前端 贾公子
博主写了对element-plus的表格和表单的封装
[表格]https://gitee.com/childe-jia/table-vue3
[表单] https://gitee.com/childe-jia/form-render
大家支持一下
展开
-
vue2&&vue3--render函数(h)
此更改不会影响<template>用户。h现在是全局导入,而不是作为参数传递给渲染函数更改渲染函数参数,使其在有状态组件和函数组件的表现更加一致VNode 现在有一个扁平的 prop 结构请继续阅读来获取更多信息!原创 2023-10-24 12:57:18 · 3612 阅读 · 0 评论 -
vue3全网最全教程-----(2)
什么是hook?—— 本质是一个函数,把setup函数中使用的进行了封装,类似于vue2.x中的mixin。自定义hook的优势:复用代码, 让setup中的逻辑更清楚易懂。useSum.ts})//向外部暴露数据useDog.ts中内容如下:// 方法try {// 发请求// 维护数据// 处理错误// 挂载钩子getDog()})//向外部暴露数据<template><h2>当前求和为:{{sum}}</h2>原创 2023-12-29 11:06:12 · 1016 阅读 · 0 评论 -
vue3全网最全教程-----(3)
缺点:后期项目上线,需要服务端配合处理路径问题,否则刷新会有。通过点击导航,视觉效果上“消失” 了的路由组件,默认是被。作用:让路由组件更方便的收到参数(可以将路由参数作为。优点:兼容性更好,因为不需要服务器端处理路径。作用:控制路由跳转时操作浏览器历史记录的模式。作用:可以简化路由跳转及传参(后面就讲)。中的数据,需要经过处理后再使用时,可以使用。作用:将特定的路径,重新定向到已有路由。浏览器的历史记录有两种写入方式:分别为。参数时,需要提前在规则中占位。的实体,每个组件都可以。中可以编写一些业务逻辑)原创 2023-12-31 12:04:30 · 1185 阅读 · 0 评论 -
vue3 全网最全教程-----(1)
2020年9月18日,Vue.js发布版3.0One Piece4800+次提交40+个RFC600+次PR300+贡献者3.3.4setup是Vue3中一个新的配置项,值是一个函数,它是“表演的舞台,组件中所用到的:数据、方法、计算属性、监视......等等,均配置在setup中。setup函数返回的对象中的内容,可直接在模板中使用。setup中访问this是undefined。setup函数会在之前调用,它是“领先”所有钩子执行的。原创 2023-12-29 10:18:31 · 1070 阅读 · 1 评论 -
vue3 key Attribute 的变化
Vue.js 中使用最多的两个指令就是v-if和v-for,因此开发者们可能会想要同时使用它们。虽然不建议这样做,但有时确实是必须的,于是我们想提供有关其工作方式的指南。原创 2023-12-31 14:46:54 · 1022 阅读 · 1 评论 -
Vue 2 生命周期与 Vue 3 生命周期:介绍与差别对比
Vue 2 生命周期由一系列钩子函数组成,这些钩子函数允许开发者在组件的不同生命周期阶段执行特定的操作。Vue 2 生命周期包括以下阶段:beforeCreate:在实例初始化之后,数据观测 (data observation) 和事件配置 (event/watcher setup) 之前调用。created:在实例创建完成后被调用,此时实例已完成数据观测,但尚未挂载到 DOM 上。在实例创建完成后被立即同步调用。原创 2023-10-26 12:03:18 · 1548 阅读 · 2 评论 -
vue依赖注入provide && inject
想象一下这样的结构:有一些多层级嵌套的组件,形成了一颗巨大的组件树,而某个深层的子组件需要一个较远的祖先组件中的部分数据。但如果你正在构建大型的应用,包含非常多的依赖提供,或者你正在编写提供给其他开发者使用的组件库,建议最好使用 Symbol 来作为注入名以避免潜在的冲突。有的时候,我们可能需要在注入方组件中更改数据。在应用级别提供的数据在该应用内的所有组件中都可以注入。最后,如果你想确保提供的数据不能被注入方的组件更改,你可以使用。如果提供的值是一个 ref,注入进来的会是该 ref 对象,而。原创 2023-12-12 16:23:13 · 139 阅读 · 0 评论 -
vue项目性能优化:去除没有引用的文件
随着项目开发的进行会经历一个混乱到整齐划一的过程,这个过程中会产生一系列冗余代码,这时候通过useless-files-webpack-plugin这个插件,可以帮助我们删除项目中无用的文件;原创 2023-09-06 10:32:24 · 782 阅读 · 1 评论 -
vue2 .sync语法糖
sync在 Vue 2 中,.sync语法糖是一个强大而方便的工具,用于实现父子组件之间的双向数据绑定。它可以大大简化代码,并使数据传递更加直观和易于理解。然而,在使用时需要注意一些约定和注意事项,以确保它能够正确地工作。希望这篇文章能够帮助你更好地理解和使用 Vue 2 中的.sync语法糖,提高。原创 2023-09-12 16:31:58 · 505 阅读 · 0 评论 -
vue+element-ui el-descriptions 详情渲染组件二次封装(Vue项目)
不外乎就是渲染新增/修改的数据(由输入框变成输入框禁用),因为输入框禁用后颜色透明度会降低,显的颜色偏暗;为解决这个需求于是封装了。一般后台管理系统,通常页面都有增删改查;原创 2023-09-17 18:30:52 · 1741 阅读 · 0 评论 -
vue 2 与 vue3 获取模版引用 (ref)的区别
虽然 Vue 的声明性渲染模型为你抽象了大部分对 DOM 的直接操作,但在某些情况下,我们仍然需要直接访问底层 DOM 元素。要实现这一点,我们可以使用特殊的refref是一个特殊的 attribute,和v-for章节中提到的key类似。它允许我们在一个特定的 DOM 元素或子组件实例被挂载后,获得对它的直接引用。这可能很有用,比如说在组件挂载时将焦点设置到一个 input 元素上,或在一个元素上初始化一个第三方库。原创 2023-10-04 08:19:25 · 507 阅读 · 0 评论 -
$attrs 和 $listeners (vue2&&vue3)
listeners。原创 2023-10-09 13:57:17 · 3758 阅读 · 1 评论 -
vue3全网最全教程-----(4)
子 => 父。注意区分好:原生事件、自定义事件。原生事件:事件名是特定的(clickmosueenter等等)事件对象$event: 是包含事件相关信息的对象(pageXpageYtargetkeyCode自定义事件:事件名是任意名称事件对象$event: 是调用emit时所提供的数据,可以是任意类型!!!--在父组件中,给子组件绑定自定义事件:-->--注意区分原生事件与自定义事件中的$event-->原创 2023-12-31 12:55:41 · 1056 阅读 · 0 评论 -
发布vue3组件到npm
当你开发Vue 3应用程序时,有时你可能会需要将自己创建的组件发布到npm上,以便其他开发者可以轻松地在他们的项目中使用这些组件。本文将指导你如何将Vue 3组件发布到npm。原创 2023-10-13 14:54:43 · 1884 阅读 · 0 评论 -
vue2与vue3 v-model的区别
data() {return {count: 1原创 2023-10-02 10:39:02 · 1449 阅读 · 0 评论 -
一文搞懂 vue2 与 vue3 函数式组件
2.x 中函数式组件带来的性能提升在 3.x 中已经可以忽略不计,因此我们建议只使用有状态的组件函数式组件只能由接收props和contextslotsattrsemit) 的普通函数创建非兼容functionalattribute 已从单文件组件 (SFC) 的<template>中移除非兼容选项已从通过函数创建的组件中移除作为性能优化,因为它们的初始化速度比有状态组件快得多返回多个根节点然而,在 Vue 3 中,有状态组件的性能已经提高到它们之间的区别可以忽略不计的程度。原创 2023-10-07 13:38:44 · 435 阅读 · 0 评论 -
vue3:直接修改reative的值,页面却不响应,这是什么情况?
今天看到有人在提问,问题是这样的,我修改了reative的值,数据居然失去了响应性,页面毫无变化,这是什么情况?本着好奇心害死猫的原则,我就看了下,我直呼好家伙!原创 2023-12-16 12:04:35 · 522 阅读 · 0 评论