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?

user6748331 · Accepted Answer · 2017-11-05 13:22:04Z

1

Just like that?

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

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

answered Nov 5, 2017 at 13:22

user6748331

Sign up to request clarification or add additional context in comments.

3 Comments

Aleksandrs Over a year ago

Thanks, for you answer. But if it would be such easy way, I would not ask such question :) this.someattr == undefined

Aleksandrs Over a year ago

Actually I rechecked everything and what a shame, everything is working. And I don't know who vote down this answer, not me :)

user6748331 Over a year ago

@Aleksandrs Thanks anyway :)

Collectives™ on Stack Overflow

Vue.js - How to pass data to component?

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related