title: How to reset a prop value to it's original value in Vuejs
body: <p>I have a vue component which posts data from a form and it's working fine, however, I need to reset the 'selected' prop to an empty value after submitting the form, how can I do that?
  Here's the blade.php file :</p>
  
  <pre><code> &lt;form action="{{ url('/cart') }}" method="POST" class="side-by-side reset"&gt;
          {{ csrf_field() }}
          {{-- form for my super not working with options vue component --}}
          &lt;input type="hidden" name="id" v-model="this.id" value="{{ $product-&gt;id }}"&gt;
          &lt;input type="hidden" name="name" v-model="this.name" value="{{ $product-&gt;name }}"&gt;
          &lt;input type="hidden" name="price" v-model="this.price" value="{{ $product-&gt;price }}"&gt;
  
          @if( ! $product-&gt;group-&gt;options-&gt;isEmpty() )
              &lt;select name="options" class="options" v-model="selected" autofocus required&gt;
                  &lt;option value=""&gt;Please select one&lt;/option&gt;
              @foreach($product-&gt;group-&gt;options as $option)
                  &lt;option class="reset" value="{{ $option-&gt;name }}"&gt;{{ $option-&gt;name }}&lt;/option&gt;
              @endforeach
              &lt;/select&gt;
          @endif
  &lt;addToCart :product="{{ $product }}" :selected="selected" @submit.prevent="onSubmit()"&gt;&lt;/addToCart&gt;
  </code></pre>
  
  <p>here's my vue file :</p>
  
  <pre><code>export default {
      props: ['product', 'selected'],
  
      data() {
          return {
              id: this.product.id,
              quantity: 1,
              name: this.product.name,
              price: this.product.price,
              options: this.selected
          }
      },
  
      watch: {
          selected: function() {
                  return this.options = this.selected; //this is initially empty, I want to reset it after form submits
          }
      },
  
      methods: {
          addtocart() {
                  axios.post('/cart/', this.$data)
                      .then(flash(this.product.name + ' was added to cart'))
                      .then( this.resetForm());
              },
  </code></pre>
  
  <p>I need to reset the selected prop to it's original empty value, but I get errors, Vuejs doesn't let me modify the prop value directly and I can't figure out how to reset it. 
  Thanks for your help.</p>