Categories
Vue Answers

How to pass props as initial data in Vue.js?

Spread the love

To pass props as initial data in Vue.js, we can set the prop value as an initial value of a reactive property.

For instance, we write

<script>
export default {
  //...
  props: {
    record: {
      type: Object,
      required: true,
    },
  },

  data() {
    return {
      recordLocal: { ...this.record },
    };
  },
  //...
};
</script>

to set the recordLocal reactive property to a copy of the record prop as its initial value.

We register the record prop in the props property.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published.