微信小程序function怎么使用(微信小程序在{{ }}中直接使用函数的方法示例)
类别:编程学习 浏览量:874
时间:2021-10-16 00:02:28 微信小程序function怎么使用
微信小程序在{{ }}中直接使用函数的方法示例前言
在微信小程序开发中(原生wxml、wxcss),想直接在{{ }}调用方法处理数据, 但是会报错。如:在项目中涉及到百分比的计算,js浮点数运算会出现精度问题,造成小数位数过多,因此想在模板语法中对值进行相应的处理。
1. 使用
<view>¥{{(money*0.03).toFixed(2)}}手续费(费率3%)</view>
报错,无法直接使用,也不能调用js中的方法。
2. 解决方案
既然{{}}中无法调用js中的函数,那该怎么办呢?微信提出了一种新的概念,WXS(WeiXin Script) ,小程序的一套脚本语言,可以在WXML的{{}}中调用.wxs的方法。
我们新建一个.wxs文件
// 支持es4语法 var filter = { numberToFixed: function(value){ return value.toFixed(2) } } // 导出对外暴露的属性 module.exports = { numberToFixed: filter.numberToFixed }
在.wxml中引入文件:
<!-- 引入.wxs文件 src为相对路径,module指定当前模块的名称 --> <wxs module="filter" src="./numberToFixed.wxs"></wxs>
在{{}}中调用.wxs模块中的方法:
<view>¥{{filter.numberToFixed(money*0.03)}}手续费(费率3%)</view>
总结
从vue到小程序,写页面最大的感觉就是,之前vue能用computed实现的一些处理或者methods的方法,可以直接在{{}}中调用,处理某些数据很便捷。微信推出WXS也是弥补了小程序{{}}中不能直接使用js中的方法的不足。另一方面也是提高了小程序的性能,各司其职。
到此这篇关于微信小程序在{{ }}中直接使用函数的文章就介绍到这了,更多相关微信小程序{{ }}使用函数内容请搜索开心学习网以前的文章或继续浏览下面的相关文章希望大家以后多多支持开心学习网!
您可能感兴趣
- 微信小程序存token(小程序开发实现access_token统一管理)
- 微信小程序可以用h5开发不(微信小程序webView嵌入H5的方法实例)
- 微信小程序日期选择器有星期天(微信小程序 滚动选择器时间日期详解及实例代码)
- 怎么编写计算小程序(微信小程序实现简易计算器)
- 微信小程序可以用百度的echarts吗(uniapp在微信小程序中使用ECharts的方法)
- css浮动小例子教程(使用css transition属性实现一个带动画显隐的微信小程序部件)
- 微信小程序简易计算器制作(微信小程序实现简单计算器功能)
- 微信小程序贪吃蛇大作战(微信小程序实现贪吃蛇游戏)
- 微信小程序swiper大小调整(微信小程序swiper-dot中的点如何改成滑块详解)
- 微信小程序计数器代码(微信小程序实现计算器案例)
- 微信小程序canvas缩放(微信小程序之html5 canvas绘图并保存到系统相册)
- 微信小程序即时聊天功能怎么实现(微信小程序实现聊天室功能)
- 微信小程序苹果部分内容打不开(微信小程序audio组件在ios端无法播放的解决办法)
- 宝塔小程序制作(宝塔面板微信小程序使用图文教程)
- 微信小程序做计算器(微信小程序实现计算器小功能)
- 微信小程序多人编辑表格(微信小程序实现固定表头、列表格组件)
- 对你思念入骨的女人,跟你见面时会有这几种表现,藏都藏不住(对你思念入骨的女人)
- 纳兰性德绝美作,一场重逢,成就最后一首称得上惊艳的《如梦令》(纳兰性德绝美作)
- 如何快速赚钱(如何快速赚钱方法真实有效)
- 这里输入关键词(如何输入关键词)
- 熊猫中国国宝(熊猫国宝酒53酱香)
- 春节会放假几天(春节会放假吗)
热门推荐
- 怎么调用dede自定义表单(DEDE模板中如何使用if进行多分支判断的教程)
- react 封装下拉选择框(React鼠标多选功能的配置方法)
- canvas心形水波(Canvas波浪花环的示例代码)
- 最新版MySQL 8.0.22下载安装超详细教程(Windows 64位)(最新版MySQL 8.0.22下载安装超详细教程Windows 64位)
- python常用的切片操作(使用python PIL库实现简单验证码的去噪方法步骤)
- php封装api(PHP常用的类封装小结4个工具类)
- docker 部署netcore(关于Jenkins + Docker + ASP.NET Core自动化部署的问题避免踩坑)
- django session验证(Django框架验证码用法实例分析)
- dedecms水印(dedecms上传透明背景图片变成黑色的解决办法)
- sql解析器配置(sql字段解析器的实现示例)