Vue中变量赋值后，修改变量，赋值数据与被赋值数据同步改变

最新推荐文章于 2024-07-03 11:37:43 发布

马小雨

最新推荐文章于 2024-07-03 11:37:43 发布

阅读量3.5k

点赞数

文章标签： vue.js 前端 javascript

原文链接：https://www.cnblogs.com/sjxx/p/10414506.html

版权

在vue中，变量赋值，修改变量会导致原始数据也同步发生改变

let a = this.file, 修改a时，this.file也改变了

原因：这是一个引用传递而不是值传递

解决：把this.file转换为字符串再转换为对象后赋值

let a = JSON.parse(JSON.stringify(this.file));

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

马小雨

关注关注

0
点赞
踩
6

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

vue赋值成功后再回调_vue的数据赋值联动改变解决方案

weixin_39816260的博客

12-22

1984

1.踩坑1.1.深拷贝/浅拷贝这实际上算不上vue的问题，算是js基础没打好的坑吧。先来看一个简单的例子：在js中也有栈(stack)和堆(heap)的概念：栈：自动分配的内存空间，大小确定会自动释放。存放变量/局部变量/形参等。在js中存放简单数据段(五种基本数据类型：Number、String、Boolean、Null、Undefined)，他们是按值存放的，可以直接访问。堆：动态分配的内存，...

在vue里面设置全局变量或数据的方法

11-28

实例如下： const MyPlugin = { // install方法是必需的 // // 包含两个参数：Vue 构造器，一个可选的选项对象 install(Vue, options) { Vue.prototype.test = "test" ; Vue.prototype.wechat = "my wechat!"; } }; export default MyPlugin 此方法可以单独起一个文件，在引入到需要的页面里面，就可以用vue实例取到相应数据，像以下use后，取数据时和取每个模块里面的data里面的数据方法是一样的 import MyPligin from

参与评论您还未登录，请先登录后发表或查看评论

vue3变量赋值后，修改一个，原来的变量也被修改

前端小白到专家的博客

04-14

4572

问题描述提示：这里描述具体问题：在vue3开发时遇到有一个大坑，在一个变量给另一个变量赋值后，修改一个变量。另一个变量同时被修改。例如： const a = ref('123') const b = ref('234') a.value = b.value a.value.length = 0 //当前a是空，b也是空原因分析：提示：这里填写问题的分析：值传递还是引用传递，当前的赋值为引用传递。解决方案：提示：这里填写该问题的具体解决方案：用JSON.stringify和JSON.

简述vue表格数据赋值给新变量后，原表格数据也随新变量数据的变化而发生改变

miem_yang的博客

09-01

701

vue表格数据赋值给新变量后，原表格数据也随新变量数据的变化而变化

VUE 中数据赋给了一个变量，修改这个变量,原数据也会被修改

小心——博客

07-10

507

此时两个变量的引用地址是一个, 而地址是存在栈内存中，变量是存在堆内存中的，如果修改其中的一个,另一个也会跟着变,解决方案就是将其引用地址进行修改。这是js的一个堆和栈的问题。

vue 给data中的数据赋值(一样的值)后,出现数据修改会被同步的问题

kawayiyao的博客

05-25

452

解决办法:把赋值的数据转成String,在转成对象。

vue中数组赋值给一个变量，修改变量值数组的值也会改变的问题。

weixin_50917325的博客

12-04

710

此时发现，打印的arr全都包括了test:"测试用例"的一个字段，也就是说，我在改变赋值的变量的时候，也同时改变了arr这个数组。去找了资料发现：这好像是vue的深拷贝和浅拷贝的知识点（我比较少做前端，并且是个编程小白，所以不太了解）使用：JSON.parse(JSON.stringify(item))

vue data变量相互赋值后被实时同步的解决步骤

11-19

在Vue.js中，`data`对象是用来存储组件状态的，它的属性会被响应式地追踪，意味着当这些属性的值发生变化时，视图会自动更新。然而，在某些情况下，当你直接将一个`data`属性的值赋给另一个`data`属性时，可能会遇到...

vue 避免变量赋值后双向绑定的操作

01-18

如： this.list = this.list2, 结果在list改变后 ...补充知识：解决vue中v-model绑定的变量赋值给了另一个变量后，两个变量同时改变先来看一下问题背景我们要做一个搜索+分页的功能，使用vue 我们将分页控件绑定了

解决vue接口数据赋值给data没有反应的问题

01-21

就是我在接口赋值给了data的变量，然后组件的效果没有出来（我的是旋转效果）代码如下： data() { return { slides: [] } }, mounted() { this.request() }, methods: { request() { this.$http.post('...

坑篇 - 前端 - vue 变量赋值变量，两个变量就会互相影响

lin18824161857的博客

06-21

6004

背景：今天搞个百度地图，然后数组，再然后遍历给每个点加自定义窗口，问题来了为啥信息窗口出不来呢？过程：无奈之下，最后直接console 百度地图point（有横，纵坐标的点数据）和markers（用百度的函数生成的标注）的数组。谁知一console，两个数组都一样，怪不得我后面的用mark.openInfoWindow(infowindow(这个是在定义信息窗口的变量)，point...

解决vue A对象赋值给B对象,修改B属性会影响到A的问题

weixin_42475906的博客

11-15

588

在vue中【=】在对象赋值里面，没有进行深层赋值，【this.A 】指向的依旧是【 this.B 】里面的原地址，所以修改了【 this.A】里面的属性，【 this.B】里面的属性也会发生改变。例：this.A = this.B 或 const A = this.B 等形式的对象赋值，修改新对象A导致原对象B同步变化。

VUE踩坑：vue赋值后原数据随赋值后的数据的变化而变化

请问这块砖要搬到哪

04-20

650

let templateF = JSON.parse(JSON.stringify(this.templateForm))

Vue 赋值后原数据随赋值后的数据的变化而变化

最新发布

qq_38810813的博客

07-03

168

最近项目遇到的一个功能点拿到了同一个数据源需要在原有的数据源处理之后分为3个板块所以处理其中一个table内的数据后其他两个table的数据也会跟着变查了一下有一种说法是浅拷贝和深拷贝学到了深拷贝的方法记录一下。

vue 表单数据修改，导致页面列表数据被同步修改问题的解决。

qq_40055200的博客

01-18

3517

在vue的项目开发中，有时候在表单提交的时候，尤其是页面中对话层编辑数据，在修改的时候，会看到列表页面的数据也在跟着改变，这是vue 的双向数据绑定的弊端，实时更新数据，因为是一个数据源，因为在修改对象的时候，对象的指针直接指向页面数据了，解决办法是：在修改的时候，会获取到当前行的对象数据，那么我们不是直接赋值给我们的页面对象数据，而是： this.addRoleFrom =JSON.parse(JSON.stringify(row)) // 改过之后的 this.addRoleFrom =Oje

【Vue】vue 数据赋值给新变量后，原数据也随新变量对数据的变化而变化解决方案

一只洒鹿

06-24

4337

vue 数据赋值给新变量后，原数据也随新变量对数据的变化而变化错误： let list = this.list1 错误写法将污染源数据，将改变list1的数据正确： let list = JSON.parse(JSON.stringify(this.list1)); 备注： **JSON.stringify()**方法用于将 JavaScript 值转换为 JSON 字符串。 JSON.parse() 方法将数据转换为 JavaScript 对象。 JS 对象(Object)和字符串(String)

【Vue 3-reactive】为什么给一个reactive包裹变量重新赋值，上一个数据源会失去响应性

kikikiuu的博客

12-06

1244

给一个reactive包裹的变量重新赋值，上一个数据源就会失去响应性。这是因为，Vue.js的数据响应式是通过对象的属性变化来实现的。当给一个变量重新赋值时，实际上是新建了一个新的对象，而上一个对象就被丢弃了。因此，Vue.js无法检测到变化，也就无法触发更新。

Vue.js中的计算属性：如何让数据自动更新

a3098448071的博客

06-28

1834

在Vue组件里，你可以通过在组件的选项对象中添加。

vue给变量赋值数组中的某一项

05-01

在Vue中，如果要给变量赋值数组中的某一项，我们可以使用Vue提供的计算属性来实现。首先，先在data中定义一个数组arr以及一个变量index，表示要修改的数组项的下标。然后在模板中使用输入框绑定arr[index]，可以实现对数组中某一项的修改。但是，如果想直接在Vue实例中通过代码来修改数组中某一项，我们可以使用计算属性来实现。比如，我们定义一个名为selectedItem的计算属性，用来获取数组中指定下标的元素，代码如下： computed: { selectedItem() { return this.arr[this.index] } } 然后，我们在模板中可以直接使用selectedItem来获取数组中指定下标的元素，而且如果在代码中修改了index的值，selectedItem会自动更新相应的元素。例如，可以在Vue实例中这样修改数组中第二个元素的值： this.index = 1 this.selectedItem = 'new value' 这样就可以快捷地实现对数组中某一项的修改。同时，计算属性还具有缓存的功能，可以避免频繁地重复计算，提高程序性能。