微信小程序wxs标签 在wxml文件中编写JavaScript逻辑

PC端开发 可以在界面中编写JavaScript脚本

vue/react这些框架更是形成了一种常态 因为模板引擎和jsx语法本身就都是在js中的

我们小程序中其实也有类似的奇妙写法 不过先声明 这东西不是很强大

我们可以先写一个案例代码

wxml代码参考

html 复制代码
<view>
    <wxs module="wordStyle">
        var formatText = function(text) {
            return text+"测试高级数据整理";
        }
        module.exports = {
            formatText: formatText
        }
    </wxs>
    <text>{{ wordStyle.formatText('hello') }}</text>
</view>

运行结果是这样的

好 我们来读一下这个代码 很明显

就相当于是一个js模块 有点像html中的 srcipt标签

里面声明了一个函数 formatText 接受一个参数 text

然后 方绘制就是传进来的 text 加上 测试高级数据整理

然后返回回去

后面 我们module.exports导出这个函数

然后在界面元素中 我们可以通过wordStyle对象来使用这里面写的函数

运行结果也明显是显示正确了的

相关推荐
Java.慈祥9 分钟前
速通-微信小程序 5Day
java·微信小程序·小程序·npm
Jing_Rainbow12 分钟前
【React-9/Lesson93(2025-12-30)】React Hooks 深度解析:从基础到实战🎯
前端·javascript·react.js
web打印社区16 分钟前
web-print-pdf:专为Web打印而生的专业解决方案
前端·javascript·vue.js·electron·html
午安~婉35 分钟前
构图跟拍相关
前端·javascript·拍照·虚拟列表
说私域40 分钟前
数字围城下的防御与突围:基于私域流量与智能名片商城小程序的用户关系重构研究
小程序·重构·流量运营·私域运营
前端程序猿i1 小时前
流式输出场景下的「双区域渲染」:让第三方 DOM 操作在 Vue 响应式更新中存活
前端·javascript·vue.js
css趣多多1 小时前
setup() 函数与语法糖
前端·javascript·vue.js
前端程序猿i1 小时前
第 3 篇:消息气泡组件 —— 远比你想的复杂
开发语言·前端·javascript·vue.js
爱上妖精的尾巴1 小时前
8-7 WPS JS宏 正则表达式 元字符应用-提取连续数字
javascript·wps·jsa
JasonSJX1 小时前
海海软件正式发布全新 DRM-X官网 Next.js 重构、多语言升级与 SEO 优化,助力全球数字版权保护
开发语言·javascript·安全·重构·视频防录屏·开源drm·加密保护课程