vue form表单最简写法

2023-11-17

vue form表单最简单写法:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <script src="https://cdn.jsdelivr.net/npm/vue@2.6.10/dist/vue.js"></script>
  <title>vue</title>
</head>
<body>
  <div id="app">
    <form @submit.prevent="submitPost">
      <input type="text" name="name">
      <input type="password" name="pass">
      <div>
        <input type="checkbox" name="ischeckbox">
        <input type="radio" name="isradio">
        <div>
          <input type="mail" name="mail">
          <div>
            <input type="file" name="img">
          </div>
        </div>
      </div>
      <input type="submit" value="提交">
    </form>
  </div>
  <script>
  const app = new Vue({
      el: '#app',
      data: {
      },
      methods: {
        submitPost(event) {
          const formData = new FormData(event.target)
          for (let [a, b] of formData) {
            console.log('所有表单填写的内容:'+ a, b);
          }
        }
      }
  });
  </script>
</body>
</html>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

vue form表单最简写法 的相关文章

  • 泛型,序列化

    何为泛型 1 JDK1 5以后推出的一种新的参数化的类型 2 通常可以理解为一种一种编译类型 在运行时无效 3 类型生活中的标签 为什么使用泛型 1 约束类中属性类型 方法参数类型 方法返回值类型 2 提高运行时性能 List s new

随机推荐

  • 西门子PLC的TCP通讯(不同项目下)②--TRCV_C指令

    西门子PLC的TCP通讯 不同项目下 TRCV C指令 上期主要了解了TSEND C指令的各项参数的意义 隐藏参数LEN等可以默认 本期将了解另一个配套组合指令块TRCV C 这是个接收指令块 大概呢跟发送指令TSEND C差不多 1 0
  • pinia的基本使用

    npm install pinia 安装pinia import createPinia from pinia app use createPinia main js中使用pinia 新建一个store文件夹 类似于vuex src sto
  • 前端技术搭建扫雷小游戏(内含源码)

    The sand accumulates to form a pagoda 写在前面 功能介绍 页面搭建 样式设置 逻辑部分 写在前面 上周我们实通过前端基础实现了贪吃蛇游戏 今天还是继续按照我们原定的节奏来带领大家完成一个游戏 功能也比较
  • Python机器学习笔记:深入理解Keras中序贯模型和函数模型

    先从sklearn说起吧 如果学习了sklearn的话 那么学习Keras相对来说比较容易 为什么这样说呢 我们首先比较一下sklearn的机器学习大致使用流程和Keras的大致使用流程 sklearn的机器学习使用流程 from skle
  • Linux下minicom的配置和使用方法

    安装配置minicom lsmod grep usbserial 如果直接使用串口线 而没有用到USB转串口设备 此步可以跳过 如果有usbserial 说明系统支持USB转串口 安装minicom Fedora自带有minicom 此步可
  • shell 守护进程之 mongodb

    场景 因为某些原因 mongodb 挂掉了 需要重启 思路 写个守护进程脚本 每分钟查看mongodb状态 这里查看mongodb进程是否存在 如果挂掉就重启 执行 1 创建sh文件 mkdir p data wwww guard mong
  • it技术交流社区与学习资料的网站大全

    点击上方蓝字 优派编程 选择 加为星标 第一时间关注原创干货 对国内技术社区 博客园 https www cnblogs com 掘金 https juejin cn 思否 https segmentfault com 开源中国 https
  • Ubuntu18.04升级到20.04

    升级方式 命令行升级 正常情况下使用如下命令即可 sudo do release upgrade 当提示如下错误信息时 得先升级本地软件包 Please install all available updates for your rele
  • 区块链的简单实现

    区块链的简单实现 什么是区块链 块结构 创世区块 hash 验证块的有效性 记录数据 从其他节点接收一个块 编写测试代码 测试结果 完整代码 什么是区块链 一个维护着一个持续增长的有序数据记录列表的这么一个分布式数据库 下面我将简单用nod
  • 玩转X-CTR100 l STM32F4 l U-Blox NEO-6M GPS卫星定位-nmealib解码库移植解码

    我造轮子 你造车 创客一起造起来 塔克创新资讯 塔克社区 www xtark cn 塔克博客 www cnblogs com xtark 本文介绍X CTR100控制器 扩展GPS卫星定位模块 型号为GY GPS6MV2 使用U BLOX
  • 数据库连接自动断开:CJCommunicationsException

    报错信息 com mysql cj exceptions CJCommunicationsException The last packet successfully received from the server was 99 117
  • JavaSE基础知识(个人总结)

    声明 1 本文为我的个人复习总结 并非那种从零基础开始普及知识 内容详细全面 言辞官方的文章 2 由于是个人总结 所以用最精简的话语来写文章 3 若有错误不当之处 请指出 基础 杂记 JRE JVM 常用类库 JDK JRE 诸多工具 如j
  • vue 循环遍历 搜寻资料

    写vue 循环遍历的 大全例子解释 转载连接 https www cnblogs com xulei1992 p 6015416 html https www jqhtml com 49765 html https blog csdn ne
  • mysql truncate语句_MySQL DELETE语句和TRUNCATE TABLE语句的区别

    在MySQL数据库中 DELETE语句和TRUNCATE TABLE语句都可以用来删除数据 但是这两种语句还是有着其区别的 下文就为您介绍这二者的差别所在 MySQL DELETE语句和TRUNCATE TABLE语句功能相似 但是二者究竟
  • Unity 游戏入门 九、 精灵动画 Sprite Animation

    1 Animator 为了在游戏对象上有动画 需要添加一个组件Animator 在工程窗口中 双击Robot 预制体 如图所示 添加Animator组件 2 Creating a New Controller 在工程窗口Animator文件
  • 分组排序取前几条之子查询和用户变量的使用

    关于一次面试的sql题 题目 在一张订单表中有三个字段 order id sale num type 类型有 衣服 鞋子 皮包 现在希望取出每种类型销量前三的记录 我在面试时候还想 啥 啥玩意 要我写单表的查询 看不起我 这不就是group
  • [QT编程系列-31]:多线程机制 - Qthread工作原理

    目录 一 Qthread工作原理 二 QThread的start 方法 三 QT 线程的生命周期 四 事件循环机制 五 QThread自带信号 六 如何在run函数中多次执行 七 QThread什么时候发送finished信号 八 为什么不
  • VS2019运行报错:引发了未经处理的异常:读取访问权限冲突。_Pnext 是 0xE。

    我们在运行VS2019代码时 报错如下信息 反复检查了代码 发现代码是没有问题的 我的代码如下 include
  • 用Java写一个五子棋小游戏

    棋盘是15 15 可以自己规定 游戏规则 1 对局双方各执一色棋子 2 空棋盘开局 3 黑先 白后 交替下子 每次只能下一子 4 棋子下在棋盘的空白点上 棋子下定后 不得向其它点移动 不得从棋盘上拿掉或拿起另落别处 5 黑方的第一枚棋子可下
  • vue form表单最简写法

    vue form表单最简单写法 div div