uni-app如何将数据动态插入table指定的Dom位置中？

不知为什么我的markdown语法显示不出来！

例如：

<template>  
  <div>  
    <div>  
      <div  v-for="(item,index) in allList" >{{`${item.name}---${index}`}}</div>  
    </div>  
    <button @click="allList.splice(2,0,{name:'第三'})"/>  
  </div>  
</template>  
<script>  
export default {  
  data(){  
    return{  
      allList:[{  
        name:"第一"  
      },{  
        name:"第二"  
      },{  
        name:"第四"  
      },{  
        name:"第五"  
      }]  
    }  
  }  
}

上面的代码初次加载完成后会大致显示为

1. 第一
2. 第二
3. 第四
4. 第五

当点击button后，在列表的第二个下标位置增加一条记录。会显示为

1. 第一
2. 第二
3. 第四
4. 第五
5. 第三

而不是

1. 第一
2. 第二
3. 第三
4. 第四
5. 第五

是VUE自动将新增的数据挂载到最后一个位置吗？
我要怎么解决这个问题，让她动态的加载到指定的位置
请各位大佬多多帮忙！