Avoid replacing instance root $data. Use nested data properties instead.

翻译

避免替换实例根$data。请改用嵌套数据属性

错误的代码

const demoData={name:"小明",age:19
}this.$data=demoData; //此种直接赋值即会导致警告产生(对象的拷贝默认是深拷贝即引用)

产生原因

最新的Vue已经不允许这样直接对跟实例$data进行赋值

解决方案

使用 Object.assign() 进行浅拷贝

const demoData={name:"小明",age:19
}Object.assign(this.$data,demoData);

转载于:https://www.cnblogs.com/roseAT/p/11360582.html

Vue开发警告[Vue warn]: Avoid replacing instance root $data. Use nested data properties instead.相关推荐

【vue开发】vue导出Excel表格教程demo
前端工作量最多的就是需求,需求就是一直在变,比如当前端数据写完之后,需要用Excel把数据下载出来:再比如前端在没有数据库想写些demo玩时,也是很好的选择. 第一步安装依赖包,修改配置 1.装依赖: ...
vscode搭建vue开发环境(vue入门)
本文基于vue2.0版本,文末说明怎么升级为vue3.0版本一.安装VScode 从官网下载,安装就行.以下操作在win+r -> cmd 命令行界面执行.在vscode中就是在创建好的项目空 ...
【vue开发】vue插件的install方法
MyPlugin.install = function (Vue, options) {// 1. 添加全局方法或属性Vue.myGlobalMethod = function () {// 逻辑.. ...
Vue终端取消vue、prettier警告warn
使用vue-cli创建时,选择了linter/formatter检查代码格式就会有警告和报错如下,警告:代码中的换行不符合规范.我裂开如果在这堆warn中有一个error的报错,还要找好久. 在. ...
vue路由，解决同一路由页面多次触发不刷新页面【vue开发】
vue路由,解决同一路由页面多次触发不刷新页面[vue开发] vue路由的机制是这样的: 不同的路由vue会刷新并跳转到相应路由,但如果是下一个点击触发的还是当前路由则当前路由页面不会被刷新要解决的 ...
前端开发：Vue报错Avoid mutating a prop directly since the value will be…的解决方法
前言前端开发中,在使用Vue开发的时候,经常会遇到一些很共性的报错提示,而且有时候提示已经很明确的告诉开发者问题出现在哪里,尤其是在Chrome的控制台输出上面,只要看一下输出日志就知道问题所在.但 ...
[Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever...
报错 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the paren ...
vue.runtime.esm.js?2b0e:619 [Vue warn]: Avoid mutating a prop
问题描述 vue.runtime.esm.js?2b0e:619 [Vue warn]: Avoid mutating a prop directly since the value will be ...
关于使用elementUI DateTimePicker组件报错[Vue warn]: Avoid mutating a prop directly since the value will be
报错信息如下: [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the ...

Vue开发警告[Vue warn]: Avoid replacing instance root $data. Use nested data properties instead.

Avoid replacing instance root $data. Use nested data properties instead.

翻译

错误的代码

产生原因

解决方案

Vue开发警告[Vue warn]: Avoid replacing instance root $data. Use nested data properties instead.相关推荐

最新文章

热门文章