[REASONML] Using Javascript npm package from REASON
For example, we want to use moment.js inside our ReasonML code.
What we can do is create a module file:
//Moment.re type tt; external momentWithDate : Js.Date.t => tt = "moment" [@@bs.module]; external format : tt => string => string = "" [@@bs.send];
Using it inside component:
/* This is the basic component. */
let component = ReasonReact.statelessComponent "Page"; /* Your familiar handleClick from ReactJS. This mandatorily takes the payload,
then the `self` record, which contains state (none here), `handle`, `reduce`
and other utilities */
let handleClick _event _self => Js.log "clicked!"; let momentNow = Moment.momentWithDate(Js.Date.make()); /* `make` is the function that mandatorily takes `children` (if you want to use
`JSX). `message` is a named argument, which simulates ReactJS props. Usage: `<Page message="hello" />` Which desugars to `ReasonReact.element (Page.make message::"hello" [||])` */
let make ::message ::times _children => {
...component,
render: fun self =>
<div onClick=(self.handle handleClick)>
(ReasonReact.stringToElement message)
(ReasonReact.stringToElement times)
(ReasonReact.stringToElement (Moment.format momentNow "dddd"))
</div>
};
[REASONML] Using Javascript npm package from REASON的更多相关文章
- Angular Npm Package.Json文件详解
Angular7 Npm Package.Json文件详解 近期时间比较充裕,正好想了解下Angular Project相关内容.于是将Npm官网上关于Package.json的官方说明文档进行了 ...
- [WASM Rust] Create and Publish a NPM Package Containing Rust Generated WebAssembly using wasm-pack
wasm-pack is a tool that seeks to be a one-stop shop for building and working with Rust generated We ...
- Node.js NPM Package.json
章节 Node.js NPM 介绍 Node.js NPM 作用 Node.js NPM 包(Package) Node.js NPM 管理包 Node.js NPM Package.json Nod ...
- [Node.js] Configuring npm package.json scripts
With a node package manager's (npm) package.json script property, you can preconfigure common tasks ...
- [NPM + React] Prepare a Custom React Hook to be Published as an npm Package
Before we publish our package, we want to make sure everything is set up correctly. We’ll cover vers ...
- npm & package.json & directories & files
npm & package.json & directories & files package.json https://docs.npmjs.com/files/packa ...
- npm package.json属性详解
概述 本文档是自己看官方文档的理解+翻译,内容是package.json配置里边的属性含义.package.json必须是一个严格的json文件,而不仅仅是js里边的一个对象.其中很多属性可以通过np ...
- npm package.json配置整理
通过npm init 创建 package.json文件 参数: name:项目名字 version: 版本号 description: 项目介绍 main: 项目的入口文件 scripts: npm ...
- 极简 Node.js 入门 - 1.4 NPM & package.json
极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...
随机推荐
- MVC-easyui-EF
easyui+jQuery+MVC+EF的一个演示 环境:visual studio 2013+sql server 创建新项目:visual C# -> Web -> visual st ...
- oracle创建静态监听
[oracle@localhost admin]$ pwd /u01/app/oracle/product/11.2.0/dbhome_1/network/admin [oracle@localhos ...
- 转载 :Linux有问必答:如何在Debian或Ubuntu上安装完整的内核源码
http://linux.cn/article-5015-1.html 问题:我需要为我的Debian或Ubuntu下载并安装完整树结构的内核源码以供编译一个定制的内核.那么在Debian或Ubunt ...
- centeros 7配置mailx使用外部smtp服务器发送邮件
发送邮件的两种方式: 1.连接现成的smtp服务器去发送(此方法比较简单,直接利用现有的smtp服务器比如qq.新浪.网易等邮箱,只需要直接配置mail.rc文件即可实现) 2.自己搭建私有的smtp ...
- caioj 1078 动态规划入门(非常规DP2:不重叠线段)(状态定义问题)
我一开始想的是前i个区间的最大值 显然对于当前的区间,有不选和选两种情况 如果不选的话,就继承f[i-1] 如果选的话,找离当前区间最近的区间取最优 f[i] = max(f[i-1, f[j] + ...
- 洛谷—— P2419 [USACO08JAN]牛大赛Cow Contest
https://www.luogu.org/problem/show?pid=2419 题目背景 [Usaco2008 Jan] 题目描述 N (1 ≤ N ≤ 100) cows, convenie ...
- 【v2.x OGE教程 17】事务处理
游戏代码中常常有些逻辑须要处理.因此OGE引擎加入了一个IUpdateHandler的类. IUpdateHandler类是OGE引擎中使用频率很之高的组件之中的一个,其本身是一个接口.内部有onUp ...
- Android入门篇(一)Androidproject的搭建,导入与导出,图标的改动
先说一些题外话吧.这是小珂同学的处女作.可能写的不好,请各位读者见谅.我先讲讲我为什么要写博文,那应该也是机缘巧合,有一次.我问学长一个问题,学长发了一个连接给我,里面是一篇博客.那时我仅仅是看 ...
- UVA 12716 GCD XOR(数论+枚举+打表)
题意:给你一个N,让你求有多少组A,B, 满足1<= B <= A <= N, 且 gcd(A,B) = A XOR B. 思路:首先我们能够得出两个结论: A-B > ...
- Cookie与Session的区别与联系及生命周期
Cookie与Session的区别与联系及生命周期 一.Session与Cookie介绍 这些都是基础知识,不过有必要做深入了解.先简单介绍一下. 二者的定义: 当你在浏览网站的时候,WEB 服务器会 ...