![](https://img-blog.csdnimg.cn/da61ceee90f3444da148f023567cec98.png?x-oss-process=image/resize,m_fixed,h_224,w_224)
VUE.js
文章平均质量分 59
vue.js的归纳栏
HuangYH~
这个作者很懒,什么都没留下…
展开
-
懒加载详解
懒加载是一种强大的技术,可以显著提高应用的性能和用户体验。通过合理地使用懒加载,你可以创建更快、更响应的Web应用。转载 2024-04-10 18:37:25 · 54 阅读 · 0 评论 -
VUE事件修饰符
Vue事件修饰符。转载 2024-04-08 17:31:46 · 21 阅读 · 0 评论 -
VUE项目中$t()的意义
这里的$t()内的字符串实则是某个目录下js文件中的一个参数。用来储存中文字符的容器,使VUE项目中出现的中文字符拉至最低。若需要在script标签中调用。则直接this.$t()转载 2023-08-15 18:40:16 · 1127 阅读 · 0 评论 -
Vue的双向绑定v-model详细介绍
JS v-model双向绑定原创 2023-07-14 18:31:41 · 1397 阅读 · 1 评论 -
VUE 项目输入框中 使用onInput
vue+ element 项目中需要根据输入的值,立即对输入框的数据进行判断;如果使用 @change ,只有在失去焦点的时候触发;这个时候可以用 oninput 监听。原创 2023-07-29 18:35:26 · 1030 阅读 · 0 评论 -
VUE中的this.$confirm
确认框写法,(与this.$router相似)VUE+VUX 写法:(参考VUX文档~)这是在项目中比较常见的。转载 2023-07-28 14:57:37 · 2793 阅读 · 0 评论 -
VUE v-slot详解 作用域插槽与具名插槽
v-slot 指令自 Vue 2.6.0 起被引入,提供更好的支持 slot 和 slot-scope attribute 的 API 替代方案。v-slot完整的由来参见这份 RFC。在接下来所有的 2.x 版本中 slot 和 slot-scope attribute 仍会被支持,但已经被官方废弃且不会出现在 Vue 3 中。转载 2023-07-27 16:42:59 · 158 阅读 · 0 评论 -
VUE中ref与$refs的引用
原生js获取DOM元素是很麻烦的,需要用如:document.getElementById这么长的API来获取,于是jQuery应运而生,$("#id")的使用使我们的操作变得简便起来。于是vue可以帮我们解决这个问题,vue也有自带的获取DOM的方法,那就是ref。它不仅可以获取DOM元素还可以获取组件。也可以通过给变量赋值的方法,展示该组件中的内容。引用调用子组件的方法,或者获取子组件的数据。属性拿到这个组件的引用,之后可以通过这个。属性中多了这个元素的引用。属性中多了这个组件的引用。原创 2023-07-25 18:30:12 · 63 阅读 · 0 评论 -
vue element-ui表格prop属性
prop:用于指定表格列的属性,它是一个字符串数组,每一项都是对应列的字段名,用于从数据中取值。 .label:用于指定表格列的标题,它是一个字符串数组,每一项都是对应列的标题。 width:用于指定表格列的宽度,它是一个数字数组,每一项都是对应列的宽度,单位为px。 fixed:用于指定表格列是否固定,它是一个布尔值数组,每一项都是对应列是否固定的布尔值。 align:用于指定表格列的对齐方式,它是一个字符串数组,每一项都是对应列的对齐方式,可选值有:lef原创 2023-07-25 10:35:09 · 1912 阅读 · 0 评论 -
VUE 实例方法二:$set
在这里我们发现虽然这个对象身上已经有了该属性,但是视图层并没有更新该数据,是什么造成的呢?由于受JavaScript的限制,vue.js不能监听对象属性的添加和删除,因为在vue组件初始化的过程中,会调用。方法,所以该属性必须是存在在data中,视图层才会响应该数据的变化。方法,所以,此时我们再次操作该属性的时候,就会引起视图的更新啦。我们发现,通过这两种方式为对象添加属性之后,他的对象身上多了。(target, sources)方法。那么,我们该如何解决这个问题呢。转载 2023-07-20 15:43:13 · 44 阅读 · 0 评论 -
VUE实例方法一: $nextTick
在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM。,是将回调函数延迟在下一次dom更新数据后调用。当数据更新了,在dom中渲染后,自动执行该函数。所以放在Vue.nextTick()回调函数中的执行的应该是会对DOM进行操作的 js代码。在组件内使用 Vue.$nextTick()实例方法特别方便,因为它不需要全局Vue。转载 2023-07-20 14:51:20 · 48 阅读 · 0 评论 -
VUE中this的引用
在VUE中使用this.引用方法是我们最常用的,它的引用范围大致分为四个方向:这些都是可以在组件中使用this.方法名直接访问的例如👇:例如👇:例如👇:VUE自带的方法在VUE官方文档里都能查阅的到的例如:$set、$data、$props、$refs、$root...等等以上说的这些都是可以通过this.方法名直接就可以访问的到的原创 2023-07-19 17:36:42 · 172 阅读 · 0 评论 -
VUE Promise详解
Promise意在让异步请求逻辑代码变得干净、直观、井然有序。Promise在设计上具有原子性,即只有三种状态:等待(Pending)、成功(Fulfilled)、失败(Rejected在调用支持Promise的异步方法时,逻辑变得非常简单,在大规模的软件工程开发中具有良好的健壮性。转载 2023-07-18 16:41:49 · 1352 阅读 · 1 评论 -
VUE 路由传参和接收参数
通过 params 传递参数,如果我们想获取 id 的参数值,可以通过 this.$route.params.id。通过 query 传参,如果我们想获取 id 的参数值,可以通过 this.$route.query.id。通过路由属性配置传参我们可以用 this.$route.params.id 来获取到 id 的值。如果不想让参数可见,又要解决刷新页面参数消失问题,只好用下面的方法。转载 2023-07-17 15:11:01 · 1150 阅读 · 1 评论 -
VUE $router与$route的基本使用
router.push和router.replace的区别是:replace不会向 history 添加新记录,而是替换掉当前的 history 记录,即使用replace跳转到的网页后,点击'回退'会跳转到上上一个页面。简单来说,route只是进行了URL和函数的映射,而在当接收到一个URL之后,去路由映射表中查找相应的函数,这个过程是由router来处理的。使用query传参的话,会在浏览器的url栏看到传的参数类似于get请求,使用params传参的话则不会,类似于post请求。转载 2023-07-17 12:00:12 · 124 阅读 · 1 评论 -
VUE 生命周期函数
VUE实例的生命周期函数包括有八个,分别是:、destroyed。转载 2023-07-17 11:03:11 · 59 阅读 · 1 评论 -
VUE props用法和传值问题
第二点,但是基本数据类型时,子组件接收了父组件中的数据再进行修改,父组件中的数据是不受影响的,也就是props的单向数据流;但是如果是对象数组这种引用类型数据的话,子组件中修改,父组件也会跟着变化的(当然,父组件中修改子组件也会变化),原因就是它们共用一个内存地址,相当于浅拷贝!!1.若是子组件定义局部变量去接收,则不接受父组件数据更新,即只能接收初始值2.基本数据类型修改,子组件不会影响父组件,但是若是引用数据类型数组对象的话,两者相互影响,共用同一个内存地址,相当于浅拷贝。转载 2023-07-15 18:41:17 · 486 阅读 · 3 评论 -
vue js中使用provide与inject传值
正常情况下,我们传数据都是在父子组件中通过props的方式进行父子组件间的传值,这种方式传数据不能跨"辈",如果想要从祖组件传数据到子组件需要一层层的传递,这样会显得很麻烦。上面的实例通过provide()提供了一个值,这样后代组件就能通过inject来接收这个由祖父组件传递过去的值。时,使用默认值,它也可以是一个函数,用来返回某些创建起来比较复杂的值,如果默认值本身就是一个函数。provide与inject解决的是祖孙组件中传值的问题:把祖组件的数据直接传递到子组件。接收两个参数,第一个参数是要注入的。原创 2023-07-15 15:19:43 · 634 阅读 · 1 评论 -
VUE 的 “语法糖”
语法糖也译为糖衣语法,是英国计算机科学家彼得·约翰·兰达(Peter J. Landin)发明的一个术语,指的是计算机语言中添加的一种语法,它可以在不影响功能的情况下,通过某种简单语法使代码更简洁,这种语法对计算机没有任何影响,但对于程序员更方便,能减少出错的概率使用语法糖能简化代码,更便于程序员开发。原创 2023-07-15 10:43:12 · 331 阅读 · 1 评论