Я пытаюсь отправить форму для определенного действия на основе значения select.

У меня есть такой шаблон:

<template>
    <form method="post" :action="myRoute" ref="myForm">
        <select @change="entitySelected" v-model="selected">
            <!-- -->
        </select>
    </form>
</template>

Я пытаюсь настроить действие формы динамически при появлении нового значения select:

<script>
    export default {
        data() {
            return {
                selected: '',
            }
        },
        computed: {
            myRoute: function () {
                return 'example.com/'+this.selected
            }
        },
        methods: {
            entitySelected(event) {
                console.log(this.$refs.myForm.action) //<- action is 'example.com' without selected value
                console.log(this.selected) //<- this value is as expected
                this.$refs.myForm.submit()
            }
        }
    }
</script>

Что не так?

P. S. Browser - Firefox

0
Tarasovych 17 Апр 2019 в 15:39

2 ответа

Лучший ответ

Наверное, не лучшим образом, но это работает:

userSelected(event) {
    this.$nextTick(function () {
        this.$refs.backdoor.submit()
    })
}
0
Tarasovych 17 Апр 2019 в 13:38

Вы можете использовать setAttribute() при обновлении выбранного значения:

this.$refs.myForm.setAttribute('action', this.myRoute); 
0
Okba 17 Апр 2019 в 13:46