我们在h5开发中,很多时候要在html中写到js代码,这个很容易实现。但是在微信小程序开发中,是不能直接在wxml中写js代码的,因此就有了wxs。在wxml中用wxs代码,有以下几种方式(在小程序文档中写的很清楚,我只不过是总结下)

  • 第一种:直接在wxml文件中使用<wxs>标签
<wxs module="dateModule">
var now = getDate();
module.exports = {
date: now
}
</wxs>
<view>当前时间:{{dateModule.date}}</view>
  • 第二种:类似于js,写一外部wxs文件,然后wxml中引用。对于这个,我直接引用官方文档中的例子
// pages/dateTool.wxs
var now = getDate();
var format = function(lastDate) {
var date = getDate(lastDate);
return date.toLocaleString();
}
module.exports = {
date: now,
format: format
}
<!-- page/index/index.wxml -->
<wxs src="../dateTool.wxs" module="dateTool"></wxs>
<view>{{dateTool.date}}</view>
  • 第三种,在一个wxs文件中引用另一个wxs文件
// /pages/tools.wxs
var foo = "'hello world' from tools.wxs";
var bar = function (d) {
return d;
}
module.exports = {
FOO: foo,
bar: bar,
};
module.exports.msg = "some msg";
// /pages/logic.wxs
var tools = require("./tools.wxs");
console.log(tools.FOO);
console.log(tools.bar("logic.wxs"));
console.log(tools.msg);
<!-- /page/index/index.wxml -->
<wxs src="./../logic.wxs" module="logic" />
  • wxs语法和js很像,但是一定要注意,在外部写完wxs文件后要给它的module对象中的exports属性设置值module.exports = { Key1:value1, key2: value2, };

在wxml中直接写js代码(wxs)的更多相关文章

  1. 在 WXML 中直接使用 JS 代码

    因为有在 Vue 下开发应用的习惯,希望能够直接在 wxml 中的标签里使用 JS 代码.微信小程序其实也是可以的,在使用 JS 代码的时候需要用{{}}来包裹起来. 以下是在 wxml 中使用 JS ...

  2. html文件在head标签中引入js地址和直接写js代码,所用时间是不同的,因为引入js地址,文件加载的时候需要通过通讯协议去解析地址,读取外部文件

    html文件在head标签中引入js地址和直接写js代码,所用时间是不同的,因为引入js地址,文件加载的时候需要通过通讯协议去解析地址,读取外部文件

  3. 在Java中直接调用js代码(转载)

    http://blog.csdn.net/xzyxuanyuan/article/details/8062887 JDK1.6版添加了新的ScriptEngine类,允许用户直接执行js代码. 在Ja ...

  4. 在Java中直接调用js代码

    JDK1.6版添加了新的ScriptEngine类,允许用户直接执行js代码. 在Java中直接调用js代码 不能调用浏览器中定义的js函数,会抛出异常提示ReferenceError: “alert ...

  5. 关于 OnCloseQuery: 顺序、不能关机等(所有的windows的广播消息都是逐窗口传递的)——如果一个窗体的OnCloseQuery事件中如果写了代码那么WM_QUERYENDSESSION消息就传不过去了msg.result会返回0,关机事件也就停止了

    系统关闭窗体的事件顺序为: OnCloseQuery ----> OnClose ----> OnDestroy 下面的代码说明问题: unit Unit3; interface uses ...

  6. iOS中UIWebView执行JS代码(UIWebView)

    iOS中UIWebView执行JS代码(UIWebView) 有时候iOS开发过程中使用 UIWebView 经常需要加载网页,但是网页中有很多明显的标记让人一眼就能看出来是加载的网页,而我们又不想被 ...

  7. HTML中直接写js 函数

    1.在HTML中直接写JS函数: <body onload="javascript:{window.location.href='http://www.baidu.com/'}&quo ...

  8. Asp.net mvc怎么在razor里写js代码

    我试图在Razor里写JS代码,但是不行 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 3 ...

  9. html中可以写php代码,但是文件后缀名需要是.php而不是.html。否则php程序不会被解析执行。

    html中可以写php代码,但是文件后缀名需要是.php而不是.html.否则php程序不会被解析执行. <div class="goods_title"><?p ...

随机推荐

  1. Web API Media Type Formatter

    public static void Register(HttpConfiguration config) { // Web API configuration and services // Web ...

  2. PIXIJS的一些使用

    我发现pixijs在国内简直就是一片静土啊,只有那么一点点的微弱的不能再微弱的声音. 我在这里整理了下我使用过程中解决和可能理解的一些问题吧,都是一个个点,而不是完整的示例. 先放官网示例: http ...

  3. iOS 视图渲染数据转CVPixelBuffer

    近两年一直从事视频行业的开发, 加班也比较严重, 好久没有写文章了, 最近稍微有些时间, 前来写点文章, 记录一些开发中遇到的问题, 和解决方法! 做视频会议项目, 当然是离不开音视频啦, 也常常和W ...

  4. 变量、常量、input、if语句

    Chapter2 Python基础 2.1 变量命名规则 字母.数字.下划线组成 不能数字开头 不能使用python中的关键字 变量名具有意义 推荐驼峰(ArvinGood).或者下划线方式 (arv ...

  5. CentOS -- RocketMQ HA & Monitoring

    RocketMQ Architecture NameServer Cluster Name Servers provide lightweight service discovery and rout ...

  6. unity之单例模式

    Unity中常见的四种单例 点击进入

  7. c++学习笔记_4

    前言:本笔记所对应的课程为中国大学mooc中北京大学的程序设计与算法(三)C++面向对象程序设计,主要供自己复习使用,且本笔记建立在会使用c和java的基础上,只针对与c和java的不同来写 运算符重 ...

  8. ACM-ICPC 2018 沈阳赛区(网络赛)

    D.Made In Heaven One day in the jail, F·F invites Jolyne Kujo (JOJO in brief) to play tennis with he ...

  9. 基于 APIGateway 打造生产级别的 Knative 服务

    作者 | 阿里云智能事业群高级开发工程师  元毅 导读:在实际应用中,通过 APIGateway(即 API 网关),可以为内部服务提供保护.提供统一的鉴权管理.限流.监控等能力,开发人员只需要关注内 ...

  10. JS-DOM ~ 01. 了解DOM,动手做一下就明白了!/鼠标事件(好吧 其实我卡了三天

    DOM概述 html加载完毕,渲染引擎会在内存中把html文档生成一个DOM树,getElementById是获取内DOM上的元素,然后操作的时候修改的是该元素的属性 体验事件/事件三要素1.事件源( ...