基于vue开发的选择区间组件

介绍

最近再做一个需求，就是写一个类似于Antd 的选择时间的区间，只不过不是选择时间，这是基于vue开发的功能，选择区间组件，从而截取开始部分和结束部分的数据，废话不多说，上成果图

实现思路

	// 点击开始
	if ((this.start === null && this.end === null)) {
	  console.log('点击开始')
	  this.chooseStartImg(v, index)
	} else if (this.start !== null && this.end === null && index > this.start) { // 点击结束
	  console.log('点击结束')
	  this.chooseEndImg(v, index)
	} else if (this.start !== null && this.end !== null) {
	  this.resetChoose(v, index)
	} else if (index === this.start) { // 如果当前选中的index等于开始的index就重置为开始选择
	  this.resetChoose(v, index)
	} else {
	  this.resetChoose(v, index)
	}

实现思路很简单，就是判断点击开始和点击结束时候的index值（索引值），就是点击开始的时候如果此时已经点击结束了就重置一下再次从头开始，如果说当前选中的index值比开始的index小则重置，以此类推，功能还在迭代，还望大佬给出意见 ！

完整代码附上：查看源代码

如果这篇文章对你有用的话，麻烦给个star，谢谢啦~