vue如何重置data:this.$options.data.call(this)

最新推荐文章于 2024-05-09 04:38:40 发布
最新推荐文章于 2024-05-09 04:38:40 发布
阅读量2.3k 收藏 9
点赞数 1
分类专栏： 笔记 前端
XJINGUO
本文链接：https://blog.csdn.net/Hy_0452/article/details/113087178
版权

重置data

Object.assign(this.$data，this.$options.data.call(this))
  • Object.assign() 方法用于将所有可枚举属性的值从一个或多个源对象复制到目标对象
  • this.$data 获取当前状态下的data
  • this.$options.data()获取该组件初始状态下的data。
    在使用options.data时 用call调用并传入当前的this，不然默认的this可能会指向全局的vue对象，造成报错

重置data中某个属性或者对象

this.form = this.$options.data.call(this).form
富可敌锅
关注
  • 1
    点赞
  • 踩
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Vue中的this.$options.data()和this.$data
mocoe的专栏
04-29 4万+
问题 项目里遇到一个问题，用this.$options.data()重置组件data时，data()里用this获取的props或method都为undefined，代码简化如下： export default { props: { P: Object }, data () { return { A: { ...
Vue中的this.$options.data()和this.$data用法说明
10-15
主要介绍了Vue中的this.$options.data()和this.$data用法说明，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
this.$options.data()
dazhongliu666的博客
04-09 1502
this.$data 获取当前状态下的data this.$options.data() 获取该组件初始状态下的data
Web前端最新vue使用 Object，深入解析前端-AutoLayout
最新发布
2401_84433807的博客
05-09 356
也就是说，如果源对象某个属性的值是对象，那么目标对象拷贝得到的是这个对象的引用。Object.assign方法用于对象的合并，将源对象（source）的所有可枚举属性，复制到目标对象（target）。Object.assign方法的第一个参数是目标对象，后面的参数都是源对象。HTTP1.1 如何解决 HTTP 的队头阻塞问题？对于定长和不定长的数据，HTTP 是怎么传输的？HTTP 中如何处理表单数据的提交？如何理解 HTTP 缓存及缓存代理？HTTP 如何处理大文件的传输？如何理解 HTTP 代理？
HTML/CSS/学习(一)
qq_43239161的博客
09-09 175
学习web前端开发基础技术需要掌握：HTML、CSS、JavaScript语言。下面我们就来了解下这三门技术都是用来实现什么的： 1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。 2. CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的东西称之为表现。 3. JavaSc...
前端开发之this.$options.data的使用
m0_50207524的博客
05-16 1447
this.$options.data:初始化对象。
重置数据this.$options.data()
m0_45219210的博客
03-29 1444
this.$options.data() 这个是vue原始的数据，就是你页面刚加载时的data this.$data 这个是现在阶段的vue数据，就是你改变data的数据 // 重置数据 resetData () { Object.assign(this.$data, this.$options.data()) }, 如果想恢复个别值，比如formInline this.formInline = this.$options.data.call(th..
Vue中的this.$options.data()的this指向问题
hunt_er的博客
11-25 6166
项目里遇到一个问题，用this.$options.data()重置组件data时报错，原因是因为form里的rule规则采用了this写法。 如下: rules: { code: [this.$rules.required()], name: [this.$rules.required()], age: [ {min: 1, max: 120, type: 'number', message: '年龄 1 到 120 之间', tri
Vue 报错TypeError: this.$set is not a function 的解决方法
10-17
在这个例子中，`$.ajax`的`success`回调函数中的`this`并没有指向Vue实例，而是指向了回调函数本身，因此无法调用`this.$set`。 ### 报错原因 在JavaScript中，函数内部的`this`值取决于函数的调用方式。在上述...
vue中 this.$set的用法详解
10-16
在Vue.js框架中，`this.$set` 是一个关键的方法，用于处理响应式数据更新的问题。在某些情况下，当你尝试直接修改对象的属性或数组的元素时，Vue可能无法检测到这些变化，进而不会自动更新视图。`this.$set` 方法...
Vue之this.$options.data()和this.$data
weixin_44090040的博客
03-31 1168
也可以通过给组件 $data 对象赋值来重置来重置整个 $data。
【前端大概一分钟】vue骚操作之this.$options.data()
热门推荐
weixin_34232744的博客
05-15 1万+
重置vue组件的data数据 在vue单文件组件里有时需要重置data中的数据，比如表单填写一半，用户想重新填写。 <script> export default { data() { return { // 表单 form: { in...
vue中this.init用法_Vue中的this.$options.data()和this.$data用法说明
weixin_30920223的博客
01-17 158
问题项目里遇到一个问题，用this.$options.data()重置组件data时，data()里用this获取的props或method都为undefined，代码简化如下：export default {props: {P: Object},data () {return {A: {a: this.methodA},B: this.P};},methods: {resetData () { ...
vue中 this.$options.data()的使用方法
smonv的博客
11-16 1781
$options.data()
Vue 中怎么重置 data
麦呢头冷的博客
11-07 3125
在某些情况下，需要重新使用data中的数据，但是data中的数据已经被各种表单、变量等赋值，那么怎么重置data的值呢？ 那么此时我们有两种办法 1. 逐个赋值 ... data() { return { name: '', sex: '', desc: '' } } ... // 逐个赋值 this.name = '' this.sex = '' this.desc = '' 但这种方法只在对象数量少的时候可以用一下，一个一个去重新赋值比较麻烦,而且代码看起来也会比较乱.
vue 使用 assign 巧妙重置data数据
态度决定一切
05-23 6737
由于Object.assign()有上述特性，所以我们在Vue中可以这样使用： Vue组件可能会有这样的需求：在某种情况下，需要重置Vue组件的data数据。此时，我们可以通过this.$data获取当前状态下的data，通过this.$options.data()获取该组件初始状态下的data。然后只要使用Object.assign(this.$data, this.$options.data...
重置vue data
09-12
要重置Vue的data，可以使用Vue的`$data`属性。以下是一个示例代码： ```javascript // 在Vue实例中重置data this.$data = this.$options.data.call(this); ``` 上述代码将通过调用`$options.data`函数来重新初始化Vue实例的data属性。需要注意的是，这种方法只会重置data的初始值，而不会影响其他Vue实例的属性或方法。 另外，如果你只想重置data中的特定属性，你可以手动为每个属性赋予初始值，例如： ```javascript // 重置data中的特定属性 Object.assign(this.$data, { propertyName1: initialValue1, propertyName2: initialValue2, // ... }); ``` 这样可以选择性地重置data的特定属性，而不是重置整个data对象。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值