动态设置进度条宽度需用v-bind:style绑定字符串格式的百分比值，如"65%"；须在computed中计算并防除零，确保data中显式声明响应式字段，多选项时各选项独立计算，外层容器加flex和100%宽保障兼容性。
uni-app里用v-bind:style动态设置进度条宽度
进度条本质就是个view，宽度由当前票数占总票数的比例决定。不能写死width: 60%，得用v-bind:style绑定计算后的width值。注意单位必须带%，否则不生效。
常见错误是直接写:style="{ width: percent }"但percent没加%，结果样式被忽略；或者用了px单位，导致在不同屏幕缩放异常。
-
percent必须是字符串，如"65%"，不能是数字65 - 推荐在
computed里算：比如progressWidth() { return `${Math.round((this.current / this.total) * 100)}%` } - 除零要防护：
this.total === 0 ? '0%' : `...`，否则NaN%会触发样式异常
投票数据变化后进度条不更新？检查响应式依赖
uni-app的data属性默认是响应式的，但如果你把票数存在Object深层属性里（比如this.voteData.a.count），又没在data里预先声明，Vue 2（uni-app 默认）无法监听变化，进度条就不会重算。
- 务必在
data()里显式初始化所有用到的票数字段，例如：current: 0, total: 0 - 如果用
Object.assign或...spread批量赋值，确保目标对象本身是响应式源（即已存在于data中） - 避免直接
this.voteList = newVoteList替换整个数组——要用this.$set或splice保证响应式更新
多选项并行投票时，每个进度条要独立计算
一个投票题有多个选项（A/B/C），每个选项都要有自己的current和total。别图省事共用一个total变量再手动减——容易算错，且无法支持“单选+多选混合”场景。
典型结构应是数组形式：options: [{ id: 'A', count: 12 }, { id: 'B', count: 8 }]，然后在v-for里为每个item单独算宽度：
<view v-for="opt in options" :key="opt.id">
<view :style="{ width: `${Math.round((opt.count / totalVotes) * 100)}%` }"></view>
</view>-
totalVotes建议用computed汇总：totalVotes() { return this.options.reduce((s, o) => s + o.count, 0) } - 别在
v-for模板里直接写复杂表达式，可读性差且不利于调试 - 移动端小屏下，
width: 0%可能看不见，加min-width: 2px保底更稳妥
真机上进度条错位或文字重叠？注意flex布局兼容性
uni-app编译到App或小程序时，部分平台对flex嵌套+百分比宽度的解析有差异，尤其当父容器没设width: 100%或display: flex未显式声明时，子元素width可能失效。
- 进度条外层容器加
display: flex和width: 100%双重保障 - 文字标签（如“42%”）和进度条
view放在同一级flex容器里，用flex: 1分配空间，避免绝对定位引发错位 - 微信小程序真机调试时，
style里不要用calc()，某些版本不支持；统一用JS计算好再传入
最麻烦的其实是异步投票成功后，接口返回的是新总数，但本地状态还没刷新完，这时候进度条会闪一下——得用nextTick或$nextTick确保DOM更新完成后再做后续操作。
