小程序项目常遇问题
2022-03-22 本文已影响0人
autumn_3d55
1.微信小程序在wxml双大括号中执行复杂运算
微信小程序数据绑定支持双大括号中的表达式,但目前只支持这四种表达式:算数表达式、关系表达式、字符串连接表达式、三元表达式。vue则是全功能的JS表达式。使用起来明显差别在于是否支持函数/方法表达式
1. 遇到的问题
<!-- 有效 -->
<view>{{ 1+1 }}</view>
<view>{{ 2>1 ? '是':'否'}}</view>
<!-- 无效 -->
<view>{{ Math.random() > 0.5 ? '大于':'小于' }}</view>
<view wx:for="{{'1,2,3'.split(',')}}">
{{item}}
</view>
2.解决方法
<view wx:for="{{fn.split(str)}}">
{{item}}
</view>
<wxs module="fn">
module.exports = {
split: function(str){
return str.split(',');
}
}
</wxs>
其它示例
<wxs module="fn">
module.exports = {
split: function(str){
return str.split(',');
},
random: function(){
return Math.random();
}
}
</wxs>
<view>{{fn.random() > 0.5 ? '大于':'小于'}}</view>
<view wx:for="{{fn.split('1,2,3')}}">
{{item}}
</view>