Как я могу использовать VueJS для перехода на другую страницу / URL? - PullRequest
Новая
       11

Как я могу использовать VueJS для перехода на другую страницу / URL?

0 голосов
/ 25 апреля 2019

Я очень новичок в JS, так что извините, если мой код не выглядит лучше.В любом случае, у меня есть форма, которая использует AWS SNS для отправки электронной почты моей компании с информацией, предоставленной в форме.Однако у меня нет отзывов, чтобы сообщить пользователю, что форма отправлена.

Я пытался использовать VueJS для перехода на другую страницу или URL-адрес, который говорит что-то вроде «Спасибо. Ваша форма отправлена», но я получаю сообщение «Не удается прочитать свойство'толчок' из неопределенного. "

В идеале я хотел бы просто использовать "this.router.push ('abc123.com');"так что после отправки формы она просто переходит на abc123.com.

Спасибо всем за любую помощь, которую вы можете оказать! 

const routes = [
    { path: 'abc123.com'}
]

const router = new VueRouter({
    routes
})
var app = new Vue({
    el: '#app',
    router,
    data(){
        return{
            yourName: null,
            from: null,
            phone: null,
            company: null,
            msg: null,
            timeframe: '',
            picked: '',
            proType: ''
        }
    },
    methods: {
        checkForm: function (){
            console.log(this.fullName);
            let result = null;
            let that = this;
            if ( this.from === null || this.from === '' ){
                alert( "Please enter a valid email address." )
                return false;
            } 
            if ( this.yourName === null || this.yourName === '' ){
                alert( "Please enter your full name." )
                return false;
            } 
            if ( this.msg === null || this.msg === '' ){
                alert( "Please enter a message." )
                return false;
            } 
            if ( this.picked === null || this.picked === '' ){
                alert( "Please choose a contact option." )
                return false;
            }
            if ( this.timeframe === null || this.timeframe === '' ){
                alert( "Please choose a time frame for the project." )
                return false;
            }
            if ( this.proType === null || this.proType === '' ){
                alert( "Please choose whether this is a new project or if it will be a modified application." )
                return false;
            } 
            that.publishSNS();
            that.redirect();                
        },

        publishSNS: function(){
                    //Removed confidential information for post
                });

                var sns = new AWS.SNS();

                var d = new Date();

                var params = {
                    Message: "Name: " + this.yourName + "\n" + "Company: " + this.company + "\n" + "Email: " + this.from + "\n" + "Phone Number: " + this.phone + "\n" + "Project Type: " + this.proType + "\n" + "Contact by: " + this.picked + "\n" + "Time Frame: " + this.timeframe + "\n" + "Message: " + this.msg,/* required */
                    Subject: 'Proposal Request' + ' (sent ' + d + ')',
                };
                sns.publish(params, function(err, data) {
                    if (err) console.log(err, err.stack); // an error occurred
                    else     console.log(data);           // successful response
                });
        },

        redirect: function(){
                this.router.push('https://360works.com/action/email');
        }

    }

}).$mount('#app')

Я ожидаю, что браузер перейдет на abc123.com после того, как пользователь отправит форму.

Ответы [ 2 ]

0 голосов
/ 25 апреля 2019

в вашем коде: this.router должно быть this.$router

Вам необходимо определить ваш маршрутизатор с помощью пути => component 

const routes = [
    { path: '/foo', component: Foo },
    { path: '/bar', component: Bar }
]

Если вы хотитекак перенаправить пользователя на другой сайт, вы можете работать с объектом местоположения напрямую без маршрутизатора 

// Sets the new location of the current window.
window.location = "https://www.example.com";
0 голосов
/ 25 апреля 2019

Используйте router.push('url') (удалите this.).Вы не объявили router в своем data(), поэтому он не будет установлен на this.Это просто локальная переменная.

...