https://developers.weixin.qq.com/miniprogram/dev/reference/wxml/conditional.html,
在微信小程序中,当一个数据变量仅在条件渲染表达式(如wx:if或wx:elif)中使用时,该变量的变化无法正确触发视图更新。但是,如果同一个变量在模板中的其他地方被直接引用(如<view>{{变量名}}</view>),则条件渲染会正常响应该变量的变化。
wxml中
<block wx:if="{{loading}}">加载中...</block>
<block wx:elif="{{imageUrl && imageUrl !== ''}}">
<image src="{{imageUrl}}"></image>
<view class="controls">
<view class="btn">+</view>
<view class="btn">-</view>
<view class="btn">R</view>
</view>
</block>
js中,
this.setData({
loading: false,
imageUrl: 'https://example.com/image.jpg'
});
观察现象:条件渲染不会响应imageUrl的变化,控制按钮和图片都不会显示
在wxml中添加一行<view style="opacity:0;">{{imageUrl}}</view>
再次观察:条件渲染现在能够正确响应imageUrl的变化,控制按钮和图片正常显示
期望行为:条件渲染应该能够正确追踪表达式中所有变量的变化,而不需要在其他地方显式引用这些变量。
实际行为:条件渲染只有在变量被模板中其他地方直接引用时,才能正确响应该变量的变化。这迫使开发者添加额外的、视觉上隐藏的元素来引用这些变量,以确保条件渲染正常工作。
微信开发者工具版本:微信开发者工具版本:1.06.2407120 (Windows 64位)
调试基础库:3.8.9,
复现率:100%

请按照链接提供能复现问题的简单代码片段(https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html)。