new Vue({
  el: '#app',
  data: {
    name: '',
    email: '',
    message: ''
  },
  methods: {
    submitForm: function() {
      // 处理表单提交逻辑
      console.log('Name: ' + this.name);
      console.log('Email: ' + this.email);
      console.log('Message: ' + this.message);
    }
  }
});

在这个例子中,我们使用 Vue.js 的双向数据绑定来绑定表单元素的值。当表单提交时,我们使用 v-on 指令来阻止默认的提交行为,并调用 submitForm 方法来处理表单提交逻辑。在这个方法中,我们可以访问表单元素的值,并执行任何必要的操作,例如发送 AJAX 请求或显示成功/失败消息。

注意:这个示例只是一个基础的表单,你需要根据实际需求添加更多的表单元素和验证逻辑。

Vue.js 表单示例:使用双向数据绑定实现简单表单

原文地址: https://www.cveoy.top/t/topic/mXdK 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录