题主解决了问题但是并没有把方案共享出来。我也是一个渴求解决方案的人，最终终于尝试出来了，技术问题有时候就像窗户纸，一捅就透，因此我决定借用这个问题把方案写出来，避免以后遇到问题的人再浪费时间。

题主要修改成的绿色上下边框效果可以通过设置indicator-class实现，不过这个边框不是indicator的，而是伪类::before和::after上的。

wxml：

<picker-view indicator-class="picker-view__indicator" class="picker-view">
  <picker-view-column>
    <view wx:for="{{[1,2,3,4,5,6]}}" wx:key="{{index}}" class="picker-view__item">{{item}}</view>
  </picker-view-column>
  <picker-view-column>
    <view wx:for="{{[1,2,3,4,5,6]}}" wx:key="{{index}}"  class="picker-view__item">{{item}}</view>
  </picker-view-column>
</picker-view>

wxss：

.picker-view {
  width: 80px;
  height: 100px;
}
.picker-view__indicator {
  height: 40px;
}
.picker-view__indicator::before {
  border-color: red;
}
.picker-view__indicator::after {
  border-color: blue;
}
.picker-view__item {
  line-height: 40px;
  text-align: center;
}

效果：

另一个问题，题主截图中的小时和分钟间的冒号的实现方案，这个实现起来就比较简单了，只需要换一个思路就行：不要将整体看作一个picker-view，那其实是两个picker-view中间加了一个冒号。

我没接触过过js语法， 示例中使用了date.getFullYear()， 这种类似的方法，哪有他们的语法介绍或者文档，这个是JS的通用文档还是小程序特有，小程序的开发文档中没有找到相应的API说明，这些资料该去哪查询？谁知道呢？

picker的绿色边框是怎么解决的？求助

性能如何

请问你解决了吗

10：03分，中件那个“:”有是怎么加上去的，官网没有给出样式，这个怎么能够实现呢