<uni-row :gutter="2">
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
</uni-row>

- 发布:2023-07-04 11:59
- 更新:2023-07-04 13:48
- 阅读:774
产品分类: uniapp/小程序/微信
PC开发环境操作系统: Windows
PC开发环境操作系统版本号: win10
HBuilderX类型: 正式
HBuilderX版本号: 3.8.4
第三方开发者工具版本号: 1.06.2303060
基础库版本号: 2.30.2
项目创建方式: HBuilderX
示例代码:
操作步骤:
<uni-row :gutter="2">
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
</uni-row>
<uni-row :gutter="2">
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
</uni-row>
预期结果:
两个col中间有间隔
两个col中间有间隔
实际结果:
没有间隔
没有间隔
bug描述:
uni-row gutter属性无效



爱豆豆 - 办法总比困难多
可以生效哦 你的代码片段开不到效果是因为 gutter设置的太小了 gutter单位是rpx
<uni-row :gutter="20">
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
<uni-col :span="12">
<view>
<image src="../../static/logo.png" style="width: 100%;height: 200rpx;" ></image>
<view>一个兔子的梦想</view>
<view>试试 100票</view>
</view>
</uni-col>
</uni-row>
5***@qq.com (作者)
确实,谢谢。文档里没写
2023-07-04 14:25