debugging in Vue. Quick and dirty way to console.dir() a reactive variable?

Question

I have this malfunctioning code within a Vue component that's caused by _errors being undefined in my data, at least when the page is loading.

  data: function () {
     var temp = {
        show_debug : false
        ,password_changed_flag : false
        ,_errors : this.$store.state.form01._errors  || {}
     }

    var data = Object.assign({}, this.$store.state.form01.data, temp);

    //this is the part I am struggling with:
    console.log("data:");
    console.dir(data);


    return data;
  },

This isn't however about what I am doing wrong, it's about how to easily console.dir(data) Vue's reactive objects.

I.e. how can I print out a simple nested object, minus the getters and setters? And take a snapshot in time of that object.

i.e. _errors seems to be present now, but I'd like to only display the state of the object at the completion of the data function, not track subsequent changes.

What I am currently getting in Firefox and Chrome is instead the following:

Answer 1

console.log(JSON.parse(JSON.stringify(thing))) 

Won't work on the Vue itself, but for data properties should be fine.