在vue中，改变某个对象的值时（如数组中的某一项或者对象的某个属性），vue并不会触发dom更新，这时就需要我们自己手动来操作。方法一：强制刷新// 此行为会重新渲染整个dom，除数据层次太多外，不建议使用
this.$forceUpdate(); 方法二：对于已经创建的实例，Vue 不允许动态添加根级别的响应式属性。但是，可以使用 Vue.set(object, proper
转载
2024-01-29 00:24:38
45阅读
Vue.js在监听一个对象的属性变化时，会通过其Setter方法进行响应式更新。但是，当一个对象被创建后，Vue.js无法动态追踪到对象属性的添加和删除，因此，直接通过obj.prop = value的方式给对象添加或修改属性时，这些属性不会触发视图的重新渲染。因此，需要使用一些特定的方法来修改对象属性，以确保Vue.js能够响应式地更新视图。下面介绍使用$set和Object.assign方法来
转载
2023-11-11 14:14:15
264阅读
最近在做一个多图片上传的组件，需求是做到多文件依次上传，并显示上传进度条。 逻辑部分实现了以后，在更新进度条视图的时候出现一点问题：动态计算生产的进度 progress 属性不会自动更新。 原来的代码是这样写的： 这里直接将 file 对象添加一个 progress 属性记录上传进度，并初始化为0，
转载
2017-04-26 13:17:00
445阅读
2评论
Vue特点详解Vue是一款流行的JavaScript框架，具有以下特点：渐进式框架Vue被称为渐进式框架，因为它是基于组件的，可以逐渐应用到现有项目中，而不需要重构整个项目。这种优势使得Vue在项目迭代过程中，能够快速迭代和更新，同时又不会影响原有的代码结构和功能。Vue的渐进式特性也意味着，即使您只是想在一个页面中使用Vue，也是完全可行的。响应式数据绑定Vue采用了响应式数据绑定的方式，当数据
转载
2023-07-04 14:17:28
77阅读
我们在使用Vue的过程中把注意力都放在了数据操作上，而忽略了关于DOM的一些东西。场景1：在created生命周期从后端获取数据后想要对DOM进行操作，发生报错，当然这时候DOM元素还没渲染完成怎么会操作成功，但是我就要操作DOM怎么办？场景2：使用 swiper 插件通过 ajax 请求图片后的滑动问题。 首先我们要对vue的数据更新有一定理解： vue是依靠数据驱动视图更新的
转载
2023-11-09 06:25:26
135阅读
在日常开发中，我们用的最多的就是 绑定数据 如果你有ng的开发经验，假设 data 你要更新数据了 但是这在vue中 并不会起到作用，DOM并没有触发变化。 vue不是已经实现的实时数据双向绑定，那么model层发生了变化之后，为什么view层没有更新呢？？？ 看官网 这里才发现 深入响应式原理 列
转载
2018-11-03 15:50:00
142阅读
2评论
在Vue应用中进行异步请求时，尤其是通过Axios库进行数据获取，我们常常需要更新Vue中的对象。这个过程可能并不直观，因此我决定详细记录这一过程，帮助大家更好地理解与实现。
## 问题背景
在网络应用开发中，数据的动态更新至关重要。Vue作为一个前端框架，提供了响应式的数据绑定机制，但在进行异步请求时却常常会遇到数据更新的问题。
> “在很多情况下，由于异步请求的性质，获取数据后需要及时反
WebSocket浏览器通过JavaScript向服务器发出建立WebSocket链接的请求，链接建立后，客户端和服务器端就可以通过TCP链接直接交互数据。WebSocket链接后可以通过send()方法来向服务器发送数据，并通过onnessage事件来接受服务器返回的数据。创建WebSocket对象let ws = new WebSocket(server);WebSocket属性属性描述ws.
转载
2024-06-22 09:10:38
34阅读
Webpack 是一个前端资源加载/打包工具。它将根据模块的依赖关系进行静态分析，然后将这些模块按照指定的规则生成对应的静态资源。它的异步加载原理是，事先将编译好后的静态文件，通过js对象映射，硬编码进打包后的 manifest.xxxx.js 文件中，然后通过JSONP原理按需加载每个chunk。每个子模块加载完毕之后，浏览器将会进行本地缓存
转载
2024-06-25 14:01:08
31阅读
问题表现 在开发的过程中遇到一个问题，就是更新对象或数组后对应的视图
原创
2022-03-02 11:40:59
3384阅读
this.$set(this.arr,"key", "")或者this.$forceUpdate() //强制刷新
原创
2022-12-13 10:19:59
531阅读
当vue的data中的值发生变化后，视图中引用部分的值是否会同时发生变化呢？首先，我们要知道有哪些更新的类型。 更新的类型 1、直接赋值更新。this.heros=[' ']，模板会立即更新。 2、通过函数更新。this.heros.push("xx)。 更新的函数： push()：在数组最后添加元素； pop()：删除最后一个元素； shift()：删除最后一个元素；
转载
2023-07-05 17:00:40
167阅读
先装好note.js安装过程很简单，一直点下一步就ok了。1.1我们通过打开命令行工具（win+R）,输入node -v查看node的版本，若出现相应的版本号说明你安装成功了 1.2.npm包管理器，是集成在node中的，所以安装了node也就有了npm,直接输入 npm -v 命令，显示npm的版本信息 现在node环境已经安装完成
转载
2023-07-05 11:29:22
444阅读
点赞
提到热更新，首先我们要有一个概念：Vue有热更新模块，而webpack也有它的HRM模块（HotModuleReplacement）。Vue热更新是基于webpack的热更新之下的粒度更小的更新，它是依托于webpack-dev-middleware对文件的监听的，是整个webpack热更新的一部分。所以想要理解Vue的热更新，必须先要了解webpack HMR的一个流程。 webpac
转载
2023-09-08 06:38:18
221阅读
我们都知道，对于node来说，前端vue代码的迭代节奏是很快的，可能一周要迭代几次，但是node的迭代却没那么平凡，可能一周更新一次甚至更久，那么为了node服务的稳定，减少node服务的发布次数，是非常有用的。 配置中心是肯定需要的，因为需要通过配置不同的资源版本号，来通知node服务更新服务上的版本号 那么 我们的vue代码 要如何改造才能实现热更新呢？ 我们就以vue官方给的例子来看以下代码
转载
2024-04-24 14:29:48
102阅读
(文章目录)
一、前言
在项目开发过程中，若将页面元素全部绑定于一个表单中，且页面中的某些元素并未直接获得，在获取页面操作值时就会出现意外效果，例如不能重置页面元素。
二、场景复现
需求：在使用el-select设计表单下拉框时，若后台返回的下拉框数组长度为1，则默认选中第一个元素。
思路：后台返回值后直接将第一个元素的value赋值给el-select的v-model。
created() {
原创
2023-08-04 09:14:36
107阅读
点赞
1评论
(文章目录)
一、前言
在项目开发过程中，若将页面元素全部绑定于一个表单中，且页面中的某些元素并未直接获得，在获取页面操作值时就会出现意外效果，例如不能重置页面元素。
二、场景复现
需求：在使用el-select设计表单下拉框时，若后台返回的下拉框数组长度为1，则默认选中第一个元素。
思路：后台返回值后直接将第一个元素的value赋值给el-select的v-model。
created() {
原创
2023-06-25 11:36:19
257阅读
点赞
1评论
在开发过程中，我们时常会遇到这样一种情况：当vue的data里边声明或者已经赋值过的对象或者数组（数组里边的值是对象）时，向对象中添加新的属性，如果更新此属性的值，是不会更新视图的。 根据官方文档定义：如果在实例创建之后添加新的属性到实例上，它不会触发视图更新。 Vue 不允许在已经创建的实例上动态
原创
2021-07-22 15:42:17
1290阅读
此时若在methods中使用 delete this.obj.a 或者 delete this.obj[“a”]会发现视图中的li不会实时更新，这种情况是由于原生delete并不能被vue检测到变化。
原创
2024-07-27 11:52:33
52阅读
在日常开发中，“Vue 更新 Axios”是一个经常面临的问题，尤其是在迁移或升级时，如何高效地更新 Axios 版本并保持现有功能的正常使用是每个开发者需要掌握的技能。本文将详细记录解决这一问题的过程，包括环境准备、集成步骤、配置详解、实战应用、排错指南、性能优化等内容。
### 环境准备
在开始之前，我们需要确保开发环境已经配置好。以下是依赖安装的指南。
```bash
# 使用 npm
