警报不适用于vuejs

时间:2015-12-24 21:16:10

标签: javascript vue.js

我关注https://laracasts.com/series/learning-vue-step-by-step/episodes/3。我正在使用netbeans 8.1。当我按下提交按钮时,不会发生vue对象中的警报,而是发生了done.html的默认html操作。控制台中唯一的错误是:

GET http://localhost:8383/favicon.ico net::ERR_EMPTY_RESPONSE

我的代码就在网络直播之外:

    <!DOCTYPE html>
    <!--
    To change this license header, choose License Headers in Project Properties.
    To change this template file, choose Tools | Templates
    and open the template in the editor.
    auth0.com/blog/2015/11/13/build-an-app-with-vuejs/


    -->
    <!--<html>-->
        <head>
            <title>TODO supply a title</title>
            <meta charset="UTF-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <link rel="shortcut icon" href="">




        </head>
        <body>
            <div id="app">  
                <form action="done.html">

                    <button type="submit" v-on:submit="handleIt">        
                    <!--<button>-->        
                        submit me!!       
                    </button>





                    <pre> {{$data|json}}</pre>
                </form>



            </div>

            <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/1.0.12/vue.js"></script>

            <script>

    //            var data = {message: "hi there"}

            new Vue({
                el: '#app',
                methods: {
                        handleIt: function()
                            {alert('hgjfhgjf');}
                    }
                });

            </script>
        </body>
    </html>

我做错了什么?

2 个答案:

答案 0 :(得分:3)

我不是vuejs专家,但是,据我所知,您必须将v-on:submit放在表单元素上,例如<form action="done.html" v-on:submit="handleIt">

答案 1 :(得分:0)

我忘了在HTML文件中添加vue_instance文件。