微信小程序在双大括号{{}}里面写方法

微信小程序在双大括号{ {}}里面写方法


在开发微信小程序中,我们有时候需要在{ { }}里面处理一些数据,比如说:格式化日期,或者是用一个方法的return值来作为显示在页面上的数据。
但是我们直接写会报错,不像用uniapp开发小程序,我们可以用计算属性,也可以用过滤器

<view class="baseText" wx:if="{
    
    {el.mixList.length>1}}">
	{
    
    {
    
    el.mixtitle}} ({
    
    {
    
    proNum(el.mixList)}})
</view>

这样写是不行的

因此我们可以这样:
1.新建一个.wxs文件,然后将方法暴露出来

// 需要注意:
// 1.不支持let,const
// 2.不支持箭头函数
var filter = {
    
    
    proNum: function (value) {
    
    
        var num = 0
        for (var i = 0; i < value.length; i++) {
    
    
            if (value[i].showType == 'flow') {
    
    
                num += 1
            } else {
    
    
                num += value[i].flowList.length
            }
        }
        return num
    }
}
// 导出方法
module.exports = {
    
    
    proNum: filter.proNum
}

2.在.wxml文件中引入并使用

// 引用.wxs文件
<wxs module='filter' src='./orderPayment.wxs'></wxs>

// 在页面上使用
<view class="baseText" wx:if="{
    
    {el.mixList.length>1}}">
	{
    
    {
    
    el.mixtitle}} ({
    
    {
    
    filter.proNum(el.mixList)}})
</view>

这样我所需要的参数就返回了
在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/x_XDGS/article/details/129213313