el-table 插入单选并进行校验

<template>
  <div>
    <el-form :model="list" ref="ruleForm">
      <el-table :data="list.tableData" style="width: 100%">
        <el-table-column prop="time" label="日期" width="180">
          <template slot-scope="scope">
            <el-form-item :prop="'tableData.' + scope.$index + '.time'" :rules="rules.time">
              <el-input v-model="scope.row.time" maxlength="200" oninput="if(value.length > 4) value=value.slice(0, 4)" placeholder="请输入">
              </el-input>
            </el-form-item>
          </template>
        </el-table-column>
        <el-table-column prop="name" label="姓名" width="180">
          <template slot-scope="scope">
            <el-form-item :prop="'tableData.' + scope.$index + '.name'" :rules="rules.time">
              <el-input v-model="scope.row.name" maxlength="200" oninput="if(value.length > 4) value=value.slice(0, 4)" placeholder="请输入">
              </el-input>
            </el-form-item>
          </template>
        </el-table-column>
      </el-table>
    </el-form>
  </div>
</template>

<script>
export default {
  data () {
    return {
      list: {
        tableData: [
          {
            time: '2016-05-02',
            name: '王小虎'
          },
          {
            time: '2016-05-03',
            name: '王小虎3'
          }
        ]
      },
      rules: {
        time: [
          { required: true, message: '请输入', trigger: 'blur' },
        ]
      }
    }
  }
}
</script>

<style>
</style>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/435722.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

深入理解swap交换分区理解及扩存

一、什么是swap交换分区? 定义&#xff1a;Swap space交换空间&#xff0c;是虚拟内存的表现形式。系统为了应付一些需要大量内存的应用&#xff0c;而将磁盘上的空间做内存使用&#xff0c;当物理内存不够用时&#xff0c;将其中一些暂时不需要的数据交换到交换空间&#xf…

windows无界鼠标,多机共享一套键鼠

原因 当前使用一台笔记本和一个台式机。用起来很麻烦。想要找到共享键鼠的方案。找到了无界鼠标这个软件。 安装 在两台电脑上都安装powertoy应用。 https://github.com/microsoft/PowerToys csdn下载 安装完成后找到无界鼠标打开 配置 多台电脑配置相同的key,刷新识别设…

1.JavaWebJava基础加强[万字长文]-Junit、反射、注解核心知识点梳理

导语&#xff1a; 一、Junit单元测试 1.Junit测试概述 2.Junit使用步骤 3.Junit_Before&After 二、反射 1.反射概述 2.反射获取字节码Class对象的三种方式 3.Class对象功能概述 4.Class对象功能_获取Field 5.Class对象功能_获取Constructor 6.Class对象功能_获取…

关于制作一个Python小游戏(三)

目录 前言: 在前面我们已经了解过了关于制作pygame的使用和在里面游戏中的简单操作的内容了,今天我们主要讲的就是关于敌机的出现和如何去操控游戏中英雄飞机和敌机的出现 1.敌机的设计: 1.1敌机出场的实现: 1.1.1游戏启动后,每个一秒钟出现一架敌方飞机 1.1.2每架敌机向屏…

机器人期刊:Science Robotics and IEEE Transactions

文章目录 1. Science Robotics (出版商 AAAS)2. IEEE Transactions on RoboticsReference1. Science Robotics (出版商 AAAS) https://www.science.org/journal/scirobotics 2. IEEE Transactions on Robotics

来,我们把LangChain了解一下

目录 LangChain简介 LangChain Experssion Language 常见API key申请 LangChain简介 最近要学的东西可太多了&#xff0c;好的&#xff0c;我们先来看看LangChain是什么东西&#xff0c;咱就是说开干吧&#xff1a; pip install langchain Get started吧&#xff1a;Get …

基于 EfficientNetV2 实现判别MNIST 手写模型分类

pytorch深度学习项目实战100例 的学习记录 我的环境&#xff1a; 白票大王&#xff1a; google colab 用其他的话&#xff0c;其实实现也行&#xff0c;但是让小白来重环境来开始安装的话&#xff0c;浪费时间 论文速读 EfficientNetV2是由 Google Research&#xff0c;Br…

(3)(3.3) MAVLink高延迟协议

文章目录 前言 1 配置 2 说明 3 消息说明 前言 ArduPilot 支持 MAVLink 高延迟协议(MAVLink High Latency)。该协议专为卫星或 LoRA 等低带宽或高成本链路而设计。 在此协议中&#xff0c;每 5s 只发送一次 HIGH_LATENCY2 MAVLink 信息。对 MAVLink 命令或请求&#xff08…

Java常用类库:Math类

在Java编程语言中&#xff0c;java.lang.Math类提供了一系列用于执行基本数学运算的静态方法。这些方法允许你执行各种数学计算&#xff0c;如三角函数、指数函数、对数函数、取整函数等。在本教程中&#xff0c;我们将介绍Math类的常用方法及其用法。 常用方法 以下是Math类…

小迪安全33WEB 攻防-通用漏洞文件上传中间件解析漏洞编辑器安全

#知识点&#xff1a; 1、中间件安全问题 2、中间件文件上传解析 3、Web 应用编辑器上传 编辑器也就是第三方插件&#xff0c;一般都是文件上传漏洞 #详细点&#xff1a; 1、检测层面&#xff1a;前端&#xff0c;后端等 2、检测内容&#xff1a;文件头&#xff0c;完…

linux安装ngnix

一、将nginx-1.20.1.tar.gz上传至linux服务器目录下 二、将nginx安装包解压到/usr/local目录下 tar -zxvf /home/local/nginx-1.20.1.tar.gz -C /usr/local/三、预先安装依赖 yum -y install pcre-devel yum -y install openssl openssl-devel yum -y install gcc gcc-c auto…

部署LVS负载均衡架构

目录 一、ipvsadm 工具 二、NAT模式下部署LVS负载均衡 1、部署NFS共享存储服务器 1.1 安装NFS软件 1.2 新建共享目录和站点文件 1.3 设置共享策略 2、部署节点服务器1 2.1 安装并启动nginx软件 2.2 挂载共享目录到网页站点目录 2.3 修改网关 3、部署节点服务器2 3.…

Python算法100例-3.7 高次方数的尾数

1.问题描述2.问题分析3.算法设计4.确定程序框架5.完整的程序 1&#xff0e;问题描述 求13的13次方的最后三位数。 2&#xff0e;问题分析 许多初学者看到本题最容易想到的方法就是&#xff1a;将13累乘13次后截取最后三位即可。但是计算机中存储的整数是有一定范围的&#…

视频扩散模型介绍 Video Diffusion Models Introduction

视频扩散模型介绍 Video Diffusion Models Introduction Diffusion 扩散模型中的一些概念DDPMDDIMCLIPLatent DiffusionStable DiifusionLoRADreamBoothControlNet 视频生成评估标准图片层面视频层面 前人的工作Make-A-VideoAlign your Latents 开源视频生成模型ModelScopeT2V&…

vant van-field 密码输入框小程序里隐藏、显示密码bug总结

老规矩先上效果图: vant 输入框组件 密码的隐藏与显示功能&#xff1a; 注: 用password属性控制密码的显示与隐藏 不要用type属性&#xff0c;type属性在真机上有时会没有效果 1、当然如果只用typepassword 不需要切换显示、隐藏也可以使用。 2、如果用到了密码的显示与…

pandas数据合并

import pandas as pd import numpy as np# 随机生成两个df df1 pd.DataFrame(np.random.randn(3,4),columns [A,B,C,D]) df2 pd.DataFrame(np.random.randn(2,3),columns [A,B,D])print(打印df1\n,df1) print(打印df2\n,df2)# 默认纵向合并 qh_df_z pd.concat([df1,df2]) …

掌握Nodejs高级图片压缩技巧提升web优化

掌握Nodejs高级图片压缩技巧提升web优化 在当今的数字时代,图像在网络开发中发挥着至关重要的作用。它们增强视觉吸引力、传达信息并吸引用户。然而,高质量的图像通常有一个显着的缺点——较大的文件大小会减慢网页加载时间。为了应对这一挑战并确保快速加载网站,掌握 Node…

高中信息技术教资学习

一、几种排序方法的基本思想 1、直接插入排序&#xff08;假设按照从小到大进行排序&#xff09; 默认第一个元素是有序的&#xff0c;从有序的元素末尾开始&#xff0c;与要插入的元素进行比较&#xff0c;如果要插入的元素比有序的末尾元素小的话&#xff0c;就将有序末尾元…

ChatGPT高效提问——说明提示技巧

ChatGPT高效提问——说明提示技巧 现在&#xff0c;让我们开始体验“说明提示技巧”&#xff08;IPT, Instructions Prompt Technique&#xff09;和如何用它生成来自ChatGPT的高质量的文本。说明提示技巧是一个通过向ChatGPT提供需要依据的具体的模型的说明来指导ChatGPT输出…

图神经网络实战(4)——基于Node2Vec改进嵌入质量

图神经网络实战&#xff08;4&#xff09;——基于Node2Vec改进嵌入质量 0. 前言1. Node2Vec 架构1.2 定义邻居1.2 在随机游走中引入偏向性1.3 实现有偏随机游走 2. 实现 Node2Vec小结系列链接 0. 前言 Node2Vec 是一种基于 DeepWalk 的架构&#xff0c;DeepWalk 主要由随机游…