Vue.js - How to pass data to component?

Question

view.blade.php:

<div id="dashboard">
        <calendar someattr="xxx"></calendar>
        <calendar someattr="yyy"></calendar>
</div>

app.js:

import Calendar from './components/Calendar.vue';

new Vue({

    el: '#dashboard',

    components: {
        Calendar
    }

});

Calendar.vue:

    <template>
       ... some code ...
    </template>

<script>
    export default {
        props: ['someattr'],
        methods: {
          fetchEvents() {
             //HERE
          }
        }
    }
</script>

Question is: how can I get attribute "someattr" value inside my component in method fetchEvents?

Answer 1

Just like that?

<template>
  ... some code ...
</template>

<script>
  export default {
    props: ['someattr'],
    methods: {
      fetchEvents() {
        console.log(this.someattr)
      }
    }
  }
</script>