CODEWITHSUNDEEP
javascriptlaravel-5vuejs2axios
Wahidul Alam
Wahidul Alam

Reputation: 1253

Pass multiple parameter by POST axios vue

I am trying to pass a props value and an form value to the backend controller using axios. But it only sends form value not the props value. My code is -

<template>
    <form @submit.prevent='onSubmit'>
        <div class="media-comment">
            <input type="text" v-model='form.comment' class="form-control" placeholder="comment...">
        </div>
    </form>
</template>

<script>
    export default {
        props: ['postId'],

        data() {
            return {
                form: new Form({comment: ''}),
                id: this.postId
            }
        },

        methods: {
            onSubmit() {
                console.log(this.postId); // it shows the value in console but the value doesnt pass
                this.form
                    .post('comments', this.data)
                    .then(post => this.$emit('completed', comment));
            }
        }
    }
</script>

in console it shows only the comment, not the prop value:

enter image description here

How to pass both value ??

thanks in advance

Upvotes: 2

Views: 24640

Answers (1)

Wahidul Alam
Wahidul Alam

Reputation: 1253

here i got the solution. 

<template>
    <form @submit.prevent='onSubmit'>
        <div class="media-comment">
            <input type="text" v-model='comment' class="form-control" placeholder="comment...">
        </div>
    </form>
</template>

<script>
    export default {
        props: ['postId'],

        data() {
            return {
                comment: ''
            }
        },

        methods: {
            onSubmit() {
                axios.post('comments', {comment: this.comment, id: this.postId})
                    .then(post => this.$emit('completed', comment));
            }
        }
    }
</script>

Upvotes: 6

Related Questions