效果图添加多条数据,日期是具体到天。

后端数据格式time:[ { s_time:' ' , e_time: ' ' }]

 <p v-for="(item,index) in form.third_extend" :key="index" style="margin-bottom:15px;">
<el-time-picker
v-model="item.time_slot"
is-range
range-separator="至"
start-placeholder="开始时间"
end-placeholder="结束时间"
placeholder="选择时间范围"
@change="handleChangeDay"
/>
<el-button type="primary" icon="el-icon-plus" size="mini" circle style="margin-left:20px;" @click="handleChange(1, index)" />
<el-button v-if="index" type="danger" icon="el-icon-minus" size="mini" circle @click="handleChange(0, index)" />
</p> <!----js-----!>
let form={
third_extend: [{
start_time: '',
end_time: ''
}]
}
//改变时间插件方法
handleChangeDay() {
form.third_extend.forEach((item) => {
item['start_time'] = Date.parse(item.time_slot[0]) / 1000;
item['end_time'] = Date.parse(item.time_slot[1]) / 1000;
});
},
// 添加 删除
handleChange(status, index) {
// 添加 / 删除
if (status) {
form.third_extend.push({
start_time: '',
end_time: ''
});
} else {
form.third_extend.splice(index, 1);
}
}
delete obj.third_extend;///删除多余对象的属性

  

vue 添加多条数据 添加日期的更多相关文章

  1. 向数据库添加100W 条数据 性能测试

    向数据库添加100W 条数据 性能测试 : 参考的相关网站目录: JDBC实现往MySQL插入百万级数据 https://www.cnblogs.com/fnz0/p/5713102.html MyS ...

  2. mybatis+oracle添加一条数据并返回所添加数据的主键问题

    最近做mybatis+oracle项目的时候解决添加一条数据并返回所添加数据的主键问题 controller层 @RequestMapping("/addplan") public ...

  3. 新建一个DataTable如何手动给其添加多条数据!

    早晨起来,想起昨天利用winform做类似于sqlserver数据库导入数据功能的时候,用到了新建一个DataTable手动给其添加多条数据,平时用不到,需要的时候想不起来了,这次不妨把他记下来.以下 ...

  4. JS每点击一次添加多少条数据

    很久不写文档,平时只写日记,所以对这个有点生疏,如果写的不好别介意. 今天闲的蛋疼,于是要写写白天的东西,并且以后也会一直更新(一直写)下去. 时间太仓促了,这几个月,今天算最晚的一次凌晨1点,吃不消 ...

  5. mvc添加多条数据到数据库

    from : http://www.th7.cn/Program/net/201502/387849.shtml mvc的视图太强大了,个人刚刚接触.(初级菜鸟,懂的不多,往大神们指点)需求是,客户点 ...

  6. asp.net mvc添加多条数据到数据库

    mvc的视图太强大了,个人刚刚接触.(初级菜鸟,懂的不多,往大神们指点)需求是,客户点击添加按钮弹出一个框选择产品后直接添加到表单中,在表单可以自己更改产品的数量,以及一些信息.mvc表单提交的时候只 ...

  7. MySQL 快速添加百万条数据

    需要向数据库添加100W条测试数据,直接在普通表中添加速度太慢,可以使用内存表添加,然后将内存表数据复制到普通表 创建表 # 内存表 DROP TABLE IF EXISTS `test_memory ...

  8. ThinkPHP框架 【 AJAX方法返回 】 例子:简单添加一条数据 和 查询一个表里的数据

    注:thinkphp使用ajax和之前使用ajax的方法一样,不同点在于之前的ajax中的url指向了一个页面,而thinkphp里面的url需要指向一个操作方法. 在模块控制器Controller文 ...

  9. 利用bulk添加百万条数据,进行测试

    (1)连接数据库 public static void BulkToDB(DataTable dt) { //数据库连接 SqlConnection sqlCon = new SqlConnectio ...

  10. java:添加一条数据到数据库中文乱码

    在数据库链接地址后面加上:characterEncoding=UTF8 如:jdbc\:mysql\://localhost\:3306/db_sjzdaj?relaxAutoCommit=true& ...

随机推荐

  1. selenium最常用的基本方法

    1.打开,关闭浏览器 打开chrome浏览器:webdriver.Chorme() 打开Firefox浏览器:webdriver.Firefox() 关闭当前浏览器窗口:driver.close() ...

  2. 230222 Radiated Immunity Pre-compliance Test

    Hello everyone, welcome to Mach1 Design EMC channel. Last time we talked about how to set up a radia ...

  3. 斐讯K2_V22.6.507.43降级+刷机整个过程

    K2刷机整个过程 (包括降级) 开始之前请先下载好相对应的工具包,其中包括: 官方固件:"K2_V22.6.506.28.bin"."K2_V22.6.507.43.bi ...

  4. JSONObject.parseObject syntax error,expect START WITH { OR [,but actually START WITH error

    JSONObject.parseObject syntax error,expect START WITH { OR [,but actually START WITH error解析JSON出现异常 ...

  5. Modern C++ ——constexpr的各种用法

    Modern C++ --constexpr的用法 Reference <现代C++语言核心特性解析> 为什么引入constexpr const可以定义常量,但也可以用来定义只读变量.co ...

  6. 如何理解JavaScript中常用的4种排序算法?

      如何理解JavaScript中常用的4种排序算法? 冒泡排序 冒泡排序是我们在编程算法中,算是比较常用的排序算法之一,在学习阶段,也是最需要接触理解的算法,所以我们放在第一个来学习. 算法介绍: ...

  7. (K8s学习笔记七)Pod的升级和回滚

    1.Deployment的升级 示例:滚动升级busybox-deployment容器 apiVersion: apps/v1 kind: Deployment metadata: name: bus ...

  8. PowerShell学习笔记二_变量、Select、Foreach、where、自动变量

    变量声明/定义变量使用$作为前缀,例如:$A.$var等.定义一:$mysqlservice=Get-Service -Name mysql ,获取mysql服务对象获取所有服务$services=G ...

  9. mybatis-关联查询3-自关联查询

    一对多的方式处理 查询指定栏目的所有子孙栏目 查询指定栏目及其所有子孙栏目 多对 一的方式处理

  10. 关于sql json数据的处理

    $resultProductPrice = DB::update("update lev_product_price set detail=json_set(detail,'$.颜色','红 ...