Update user profile Vue-Laravel

Simple, instead of using :auth="{{ Auth::user() }}" , be sure to remove the : points, and in this way you will be specifying to html that auth is just one more property of the element within the DOM; It will also be necessary to transform the user to type JSON when passing it to the property:

<profile-component auth="{{ Auth::user()->toJson() }}"></profile-component>

Problem within the Vue component

You will realize that even doing this will not work your component and that is because Vue will interpret the value of the property auth as a string, there are many ways to solve this, I'll go for the simplest. In order to solve the property problem, it will be necessary to transform the data at some point of the component's life cycle and add it to a new data, an example could be:

<script>
export default {
  props: ['auth'],
  data() {
    return {
      user: { },
    }
  },
  mounted() {
    this.user = JSON.parse(this.auth);
  },
  methods: {
    editUser() { }
  },
  filters: {
    moment: function(date) {
      return moment(date).format("D [de] MMMM [de] YYYY ");
    }
  }
}
</script>

NOTE: You have to replace all use of auth with user within your template.

<template>
   <div class="row">
     <form  class="form-horizontal form-material">
       <div class="form-group">
         <label class="col-md-12">Nombre</label>
           <div class="col-md-12">
             <input type="text" class="form-control form-control-line"
               v-model="user.name">
             </div>
           </div>
           <div class="form-group">
             <label class="col-md-12">Apellido</label>
               <div class="col-md-12">
                 <input type="text" class="form-control form-control-line"
                   v-model="user.lastname">
               </div>
            </div>
            <div class="form-group">
              <label class="col-sm-12">Genero</label>
              <div class="col-sm-12">
                <select class="form-control form-control-line">
                  <option>Femenino</option>
                  <option>Masculino</option>
                  <option>Otra orientación</option>
                </select>
              </div>
            </div>
            <div class="form-group">
              <label class="col-md-12">Sobre mi</label>
              <div class="col-md-12">
                <textarea rows="5" class="form-control form-control-line"
                 v-model="user.description">
                </textarea>
              </div>
            </div>
          <div class="col-sm-12">
            <button class="btn btn-success" 
              v-on:click="editUser()">Actualizar
            </button>
          </div>
      </form>
    </div>
</template>

Update information through an AJAX request

Taking into account that you are using Axios, you should follow a process similar to the following:

function editUser() {
  // Usar FormData es estrictament necesario cuando se trata de
  // enviar información como imágenes o contenido multimedia, en este
  // caso no es estrictamente necesario ya que no trabajas con contenido
  // multimedia, pero lo dejo para cualquier cambio futuro que puedas hacer.
  let data = new FormData();

  data.append('name', this.user.name);
  data.append('lastname', this.user.lastname);
  data.append('description', this.user.description);
  // ...

  axios.put('/la-url-para-editar', data)
       .then(response => {
          // Aquí pones cualquier operación una vez que el usuario
          // se actualizó exitosamente; un ejemplo, redireccionar a
          // otra página.
       })
       .catch(errors => {
          // Aquí las operaciones si ha ocurrido algún error.
       });
}

Keep in mind that axios works it is necessary that you specify the csrf token within the configurations of axios , if you use Laravel Mix, you will not have any problem since this already counts in the default configuration (inside the bootstrap.js file) the integration of said token.