微信小程序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对象来使用这里面写的函数

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

相关推荐
张元清12 小时前
React Hooks vs Vue Composables:2026 年全面对比
前端·javascript·面试
yuki_uix12 小时前
从三个自定义 Hook 看 React 状态管理的设计思想
前端·javascript
CyrusCJA13 小时前
JavaScript原型与super关键字
前端·javascript·js
Kingexpand_com13 小时前
物联网APP开发实战:如何打造用户真正愿意用的智能硬件伴侣
物联网·小程序·app·智能硬件·物联网app定制开发
codeshareman14 小时前
JSON.stringify 在 React Hooks 依赖项里的坑:一次复盘
javascript
进击的尘埃14 小时前
把 LLM 吐出来的组件扔进 `iframe` 跑:沙箱隔离这件事没你想的那么简单
javascript
ujainu14 小时前
Electron 极简时钟应用开发全解析:托盘驻留、精准北京时间与 HarmonyOS PC 适配实战
javascript·electron·harmonyos
清空mega14 小时前
《Vue Router 与 Pinia 入门:页面跳转、动态路由、全局状态管理一篇打通》
前端·javascript·vue.js
进击的尘埃14 小时前
从一个 `console.log` 顺序翻车说起,聊聊微任务那些糟心事
javascript
脑子不好真君14 小时前
手势操控的粒子土星 (Three.js + MediaPipe)
开发语言·javascript·ecmascript