VueJS 获取数据作为对象

Posted 2023-02-23

【中文标题】VueJS 获取数据作为对象

【英文标题】：VueJS get data as object

【发布时间】：2018-02-15 21:37:20

【问题描述】：

这是一个 VueJS 组件：

<template>
  <a @click="log">click me<a>
</template>

<script>
  export default 
    data() 
      return 
        a: "a",
        b: "something",
        foo:  bar: "baz" ,
        // etc.
      
    ,
    methods: 
      log() 
        // console.log( data ); 
        // ???
      
    
  
</script>

我想从 log 函数中访问 data 并将其作为对象获取（就像在其声明中一样）。我知道我可以得到这样的数据：

log() 
  console.log( this.a );
  console.log( this.b );
  console.log( this.foo );

但我想要的是整个数据作为一个对象（因为我想通过事件将数据发送到父组件）。

有没有办法在组件的方法中获取整个数据对象？

【参考方案1】：

您可以使用this.$data 访问当前组件的数据对象。

参考：Link

所以日志功能应该是这样的：

log() 
  console.log(this.$data.a);
  console.log(this.$data.b);
  console.log(this.$data.foo);

【参考方案2】：

我认为您正在寻找的是返回整个数据对象，如下所示：

log() 
  console.log(this.$data);