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

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

相关推荐
像我这样帅的人丶你还3 分钟前
前端监控体系与实践:从错误上报到内存与 GC 观测
前端·javascript·架构
a11177622 分钟前
高斯泼溅 (Gaussian Splatting) 的 Three.js 实现
开发语言·javascript·ecmascript
代码北人生29 分钟前
agent时代,我们都低估了这个 23k Star 的 Claude Code Skills 项目!
javascript
成都渲染101云渲染666630 分钟前
云渲染全面支持3dsMax 2027,高效渲染体验升级
开发语言·前端·javascript
307632 分钟前
uni-app在微信小程序国际化分包方案:优雅解决主包体积超限问题
微信小程序
zs宝来了38 分钟前
微前端架构:qiankun 沙箱隔离与样式冲突
前端·javascript·框架
M ? A1 小时前
Vue 的 scoped 样式穿透 React 不支持?用 VuReact 编译就行
前端·javascript·vue.js·react.js·面试·开源·vureact
zs宝来了1 小时前
Vue 3 Composition API:响应式系统与依赖追踪
前端·javascript·框架
村上小树1 小时前
非常简单地学习一下slate.js的原理
前端·javascript
web打印社区1 小时前
[特殊字符] 开源好物:web-print-pdf,让 Web 打印像调用接口一样简单!
前端·javascript·vue.js·electron