微信小程序之脚本语言wxs

        大家知道,微信小程序的脚本语言是*.js,提供给页面*.wxml来调用的,微信官方后来推出脚本语言wxs,主要为补充页面渲染需要的脚本化支持。就好比jsp,php都提供有标签脚本,页面可以方便的调用相关功能函数来渲染页面。下面简单介绍一下使用方法。使用相对比较简单,基本相当于js脚本的写法,只是调用使用方法有些差异化。

1.声明脚本文件,比如subutil.wxs

//字符串分割
var split=function(names) {
    return names.split(',')
}
//module.exports.split = split
//字符串截取
var substring= function(a_str,a_start,a_end){
    var result=a_str;
    result = a_str.substring(a_start, a_end);
    return result;
}
module.exports = { 
  split: split,
  substring: substring,
};

2.页面文件中调用,比如:调用文件为test.wxml

<wxs src="../../subutil.wxs" module="subutil"></wxs>
...
<block wx:else>
    <block wx:if="{{subutil.substring(vposter,0, 4)=='http'}}">
      <video src="{{videoUrl}}" id="video_main" poster="{{vposter}}" autoplay="true" bindplay="to_bindplay" bindtimeupdate="to_bindtimeupdate"></video>
    </block>  
    <block wx:else>
      <video src="{{videoUrl}}" id="video_main" poster="{{hostImg}}{{vposter}}" autoplay="true" bindplay="to_bindplay" bindtimeupdate="to_bindtimeupdate"></video>
    </block>
</block>  
...

这样我们在页面中就可以直接调用wxs声明的函数来展示页面。

本文持续改进、完善,欢迎大家提供宝贵意见...

发布了179 篇原创文章 · 获赞 16 · 访问量 22万+

猜你喜欢

转载自blog.csdn.net/yan_dk/article/details/102451321