iview table添加input框,且校验
方法一 render渲染
{
title: "用户名",
key: "stockPrice",
render: (h, params) => {
return h("Form", [
h("Input", {
style: {
marginLeft: "4px",
width: "150px"
},
props: {
type: "text",
value: params.row.stockPrice //使用data中的key
},
on: {
input: event => {
this.data1[params.index].stockPrice= event;//双向绑定
console.log(event,this.data1);
}
}
}),
]);
}
},
方法二 templete模板
<Table
:columns="columns1"
:data="data1"
style="margin-bottom: 20px;"
v-if="userForm.setUp == '否'"
ref="table"
>
<template slot-scope="{ row, index }" slot="name">
<Form :model="row">
<FormItem
prop="name"
:rules="{required:true , message: '必填项', trigger: 'change'}"
class="formRule"
>
<Input type="text" v-model="row.name" style="width:120px"/>
</FormItem>
</Form>
</template>
</template>
</Table> columns1 定义 " slot="name" data1中定义name
iview table添加input框,且校验的更多相关文章
- h5 页面点击添加添加input框
h5 页面点击添加添加input框 前段时间有个需求,页面要能点击添加按钮控制input框的个数,当时感觉有点难,就没做,这两个又遇到了,没办法写了个简单的 效果图,加号增加,减号减少 直接上代码, ...
- iview Table表格单选框互斥
表格中添加单选框,并且互斥 首先带data中定义 currentid : 0 :表示默认不选中 { title: "名称", key: "name", re ...
- js修改页面动态添加input框显示与按钮可编辑
1. <%@ page language="java" contentType="text/html;charset=UTF-8"%> <%@ ...
- el-mement表单校验-校验失败时自动聚焦到失败的input框
思路:调用input的focus()事件,聚焦到失败的input框上, 问题:如何获取失败的input框,结合element的校验方法,查看可以提供入口的地方 调用this.$refs[formNam ...
- 类似input框内最右边添加图标,有清空功能
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- 让单选input框,不在被选中,添加disabled即可。输入框input的一些技巧
1.让单选input框,不在被选中,添加disabled即可 2.input的file文件对象的清空,只需要input.val("");就可以了.
- element 表单校验失败自动聚焦到失败的input框
1.在对应的input框上添加ref属性,直接根据ref就可精确地获取到元素 <el-form-item label="课程名称" :label-width="fo ...
- 根据select不同的选项实现相应input框添加项的显示
实现效果: @1.单击包时,显示包时的添加项 @2.单击包里程,显示包里程的添加项 二 代码实现: 给select添加change事件 获取当前select的value 根据value判断对象显示其 ...
- 用JS添加文本框案例代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- js动态给table添加/删除tr的方法
js动态给table添加/删除tr的方法. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> ...
随机推荐
- LINUX 简单命令学习总结
命令知识点大纲: 一.默认目录的简单介绍 1)/root/用户名:如/root/test1,该目录为普通用户的家目录,所有用户创建后都能在该目录下找到自己对应的目录信息 /etc:该目录为配置文件存放 ...
- SAP 后台任务定时job
定时任务的事务码 sm36:创建定时任务 sm37:查看定时任务 JDBG:后台任务debug,在对应的sm37中对应的job页面 t-code输入 创建定时任务SM36 名称可以随便起 一般都是按自 ...
- Web文件上传模块 Plupload
Plupload 是一个Web浏览器上的界面友好的文件上传模块,可显示上传进度.图像自动缩略和上传分块.可同时上传多个文件. 示例代码: <!-- Load Queue widget CSS a ...
- SQLServer中使用between查询日期
SQL Server中字段是Datetime型 以" YYYY-MM-DD 00:00:00" 存放的 between and是包括边界值的,not between不包括边界值,不 ...
- Window 连接linux系统上的Redis
windows 设置连接linux redis 一.查看linux 6379端口是否开发 firewall-cmd --query-port=6379/tcp 如果返回no则端口没有开启 fire ...
- 2022-04-26内部群每日三题-清辉PMP
1.一家组织的经验教训数据库表明过去的重大项目问题是质量失败.项目经理在制定质量管理过程时决定做得更彻底.为确保质量,项目经理应该怎么做? A.根据项目的范围和需求制定质量管理计划. B.将所有质量控 ...
- selenium模拟鼠标点击
JAVA环境 WebElement button = driver.findElement(By.xpath("/html/body/div[1]/div[3]/h2/div[2]" ...
- 【ADB命令】获取应用包名
打开cmd,输入命令,然后点击要查看的应用,即可获取对应包名. adb shell am monitor
- taro 学习笔记
1.Taro 是一个开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发 微信 / 京东 / 百度 / 支付宝 / 字节跳动 / QQ / 飞书 小程序 / H5 / RN ...
- Linux Conda 使用activate无法进入环境,但list中有环境的路径
安装OpenFace时装了个miniconda,之后就进不去anaconda的其它环境了: (pfld) .....$ conda env list # conda environments: # / ...