vuedraggable组件调整元素位置时，样式不跟着走——抛出的v-for的key的问题

vuedraggable，是一个拖拽换位的组件，vue2.0+组件，挺强大的，有需要的自己去搜索
https://github.com/SortableJS/Vue.Draggable
项目中，需要用到两个元素调换位置，并且，每个元素可以改变高度的功能。

红色框可以调整其高度。好了，重点来了，当两个元素调位置的时候，我发现，样式却带不来。如下图

上图是第二个改变了大小，

上图是调换后的效果，为啥第二个框的样式没有上去？？？v-for确实是按要求循环的啊，奇怪了。

<draggable v-bind="dragOptions" v-model="questionBox">
	<div v-drag class="pager-panel" v-for="(item,index) in questionBox" :key="index">
		<div class="q-title">{{ $com.num.numConvertChinese(item.no)}}、{{item.title}}</div>
		<div class="title-btn">
			<el-button type="primary" size="small" @click="handleSetting(item.questionType)">设置</el-button>
			<el-button type="primary" size="small" @click="handleDelQuestion(index)">删除</el-button>
		</div>
		<div class="q-content">
			<div v-if="item.questionType==0">000</div>
		</div>
		<div class="b-line"></div>
	</div>
</draggable>

代码如上，找了好多错误，后来突然间想到，难不成是v-for的:key的问题？

果不其然，还真是，因为我一直都用index绑定，如果在正常的列表的时候，循环是没有问题的。但是像我的项目需求，元素改变了样式，但调位置时却不跟着走就是因为index，因为我是为第N个修改的样式，自然修改的样式永远绑定到第n个元素上。

将v-for中的:key换成自己生成的id，或者时间戳即可。我是绑定在生成的时间戳上。

总结，有时候最不起眼的小地方却成了你马失前蹄的原因，所以还是要多多读文档。