026——VUE中事件修飾符之使用$event與$prevent修飾符操作表單


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>事件修飾符之使用$event與$prevent修飾符操作表單</title>
    <script src="vue.js"></script>
</head>
<body>
<div id="hdcms">
    <!--<form action="" @submit="post($event)">-->
    <!--prevent 寫入到代碼里面等同於寫入js中。阻止提交事件發生-->
    <form action="" @submit.prevent="post('lantian')">
        <h1>{{times}}</h1>
        <button>提交</button>
    </form>
</div>
<script>
    var app = new Vue({
        el: '#hdcms',
        data: {
            times: new Date()
        },
        methods: {
//            post($event) {
//                //preventDefault() 阻止元素發生默認的行為
//                event.preventDefault();
//                alert('lantian');
//            },
            post(num) {
                alert(num);
            }
        }
    });
</script>

</body>
</html>

  


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM