title: Vue.js - unwanted manipulate data reference
body: <p>problem is i copied the value of <code>newEvent object</code> in <code>newEventBody</code> variable and i want while i call api manipulate the data in newEventBody variable and send it . with no change in newEvent property in data object! but im surprised that it change the newEvent properties every time i call api
  what is the problem?</p>
  <p>data:</p>
  <pre><code>newEvent: {
              start_time: '',
              end_time: '',
  },
  </code></pre>
  <p>methods:</p>
  <pre><code>async createEvent() {
  
                  let newEventBody = this.newEvent;
                  newEventBody.start_time = newEventBody.start_time.split('+')[0] + 'Z';
                  newEventBody.end_time = newEventBody.end_time.split('+')[0] + 'Z';
                  ApiService.post(process.env.VUE_APP_EVENTS, newEventBody)
                      .then(() =&gt; {
                      })
                      .catch(err =&gt; {
                      });
  },
  </code></pre>