[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 ...
随机推荐
- svn 学习
svn命令在linux下的使用 svn命令在linux下的使用SVN软件版本管理 1.将文件checkout到本地目录svn checkout path(path是服务器上的目录)例如:svn che ...
- PatentTips - Managing sequenced lock requests
BACKGROUND In a multi-threaded processing environment, two or more threads may require access to a c ...
- 洛谷——P3368 【模板】树状数组 2
https://www.luogu.org/problem/show?pid=3368 题目描述 如题,已知一个数列,你需要进行下面两种操作: 1.将某区间每一个数数加上x 2.求出某一个数的和 输入 ...
- LeetCode -- 最大连续乘积子序列
问题描写叙述: 给定数组,找出连续乘积最大值的子序列.比如 0,-1,-3.-2.则最大连续乘积为6= (-3) * (-2) 实现思路此题与最大连续和的子序列问题相似,也可通过找到递推公式然后用DP ...
- js斐波那契数列求和
一.递归算法 function recurFib(n) { if (n < 2) { return n; } else { return recurFib(n-1) ...
- 用Linux建立多应用系统备份服务器
用Linux建立多应用系统备份服务器 本文旨在结合自己的工作实际,利用LinuxFTP服务器建立了一个多系统备份服务器异地备份策略. 1 建立LinuxFTP服务器 使用了Red Hat Enterp ...
- mybatis集成到spring理解
- secureCRT 小技巧
破解: keygen.exe 放到安装目录下填好姓名公司 ,patch后generate就行了 连接问题: 连接出现socket error很有可能是你的防火墙没关,今天排查了很久才发现是这个问题,浪 ...
- ajax跨域过程
- Windows系统的关机、休眠和睡眠状态究的区别
原文:Windows系统的关机.休眠和睡眠状态究的区别 相信有些小伙伴跟我一样,对电脑的一些常用操作或名词不太熟悉,今天我们就简单来聊聊电脑的关机.休眠和睡眠状态究竟有何区别吧! 如果你在电脑左下角的 ...