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-ment">
            <input type="text" v-model='formment' class="form-control" placeholder="ment...">
        </div>
    </form>
</template>

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

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

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

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

How to pass both value ??

thanks in advance

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-ment">
            <input type="text" v-model='form.ment' class="form-control" placeholder="ment...">
        </div>
    </form>
</template>

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

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

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

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

How to pass both value ??

thanks in advance

• javascript
• laravel-5
• vuejs2
• axios

• Have you tried '.post({post: this.data, id: this.id}' – Phorce Commented Jul 23, 2017 at 19:25

1 Answer 1

here i got the solution.

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

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

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

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