微信小程序用wx:for循环出来的东西样式会变？

微信小程序里，同样的数组，用wx:for循环出来，和直接多写几个框框，样式竟然不同。这究竟为什么啊。因为用wx:for写的时候上面总是空了一行出来无法去掉。

样式都是这样：

        （也可以去掉其中一些，但关键是不管去哪些，两种wxml写法写出来，效果都不一样。）

.per{
  display:block;
  background:yellow;
  border:2rpx solid black;
  height:60rpx;  
  line-height: 60rpx; 
  width:100rpx;
}

两种不同的wxml写法我都放到一起：

<view>
    <view class="container-left">
      <text class="per" wx:for="{{[1,2,3,4]}}" wx:key="index">
          1
      </text>

      <view>66666666666666666666666666666666666666666666666666666666666</view>

      <text class="per">1</text>
      <text class="per">1</text>
      <text class="per">1</text>
      <text class="per">1</text>
  </view>
</view>

可以看到，用wx:for写，上面总是会空出来一些。

但总之，它两一直不一样。

最后发现原因，居然是wxml里<text></text>标签中间写内容时，不该换行，直接写成<text>1</text>就没有问题了。

像我这样其实一般不会出问题。

但是当你要写的东西是这样时：<text>{{item.value.name[index]}}</text>一大串时，通常为了好看就会下意识的专门用一行来写内容，就容易出现上面有空的问题了。