[WASM Rust] Use the js-sys Crate to Invoke Global APIs Available in Any JavaScript Environment
js-sys
offers bindings to all the global APIs available in every JavaScript environment as defined by the ECMAScript standard.
In this lesson, we will install and use js-sys
to invoke JavaScript's Date API to grab the current time. The date will need to be converted to a value Rust can use and display that date from Rust in the browser.
Cargo.toml:
[dependencies]
cfg-if = "0.1.5"
wasm-bindgen = "0.2.25"
js-sys = "0.2"
lib.rs:
// Called by our JS entry point to run the example
#[wasm_bindgen]
pub fn run() {
let now = js_sys::Date::now();
let now_date = js_sys::Date::new(&JsValue::from_f64(now)); let val = document.createElement("p"); val.set_inner_html(&format!(
"Hello from Rust, it's {}:{}",
now_date.get_hours(),
now_date.get_minutes()
));
document.body().append_child(val);
}
index.js:
import("../crate/pkg").then(module => {
module.run();
});
[WASM Rust] Use the js-sys Crate to Invoke Global APIs Available in Any JavaScript Environment的更多相关文章
- Day.js 是一个轻量的处理时间和日期的 JavaScript 库
Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样. 如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js ...
- [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 ...
- [WASM + Rust] Debug a WebAssembly Module Written in Rust using console.log
Having some kind of debugging tool in our belt is extremely useful before writing a lot of code. In ...
- Ext JS学习第九天 Ext基础之 扩展原生的javascript对象
此文来记录学习笔记: •Ext对于原生的javascript对象进行了一系列的扩展,我们把他们掌握好,更能深刻的体会Ext的架构,从而对我们的web开发更好的服务, 源码位置,我们可以从开发包的这个位 ...
- js 计算当年还剩多少时间的倒数计时 javascript 原理解析【复制到编辑器查看推荐】
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JS的六大对象:Global、Math、Number、Date、JSON、console,运行在服务器上方的支持情况分析
在ASP中使用runat="server"来调用JS的相关函数,代码如下: <script runat="server" language="j ...
- face-api.js:一个在浏览器中进行人脸识别的 JavaScript 接口
Mark! 本文将为大家介绍一个建立在「tensorflow.js」内核上的 javascript API——「face-api.js」,它实现了三种卷积神经网络架构,用于完成人脸检测.识别和特征点检 ...
- js中获取一个对象里面的方法和属性的javascript
<script type="text/javascript"> var obj = { attribute:1, method:function() { alert(& ...
- 为什么很多国内公司不使用 jQuery 等开源 JS 框架(库),而选择自己开发 JavaScript 框架?
http://www.zhihu.com/question/20099586/answer/13971670 我对公司JAVASCRIPT框架的定位思考:
随机推荐
- (转)WARNING: REMOTE HOST IDENTIFICATION HAS CHANGED!
[root@bak1 bak]# scp gwsyj.sql.gz root@192.168.21.65:/data/dbdata/ @@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@@ ...
- 对linux中source,fork,exec的理解以及case的 使用
fork 使用 fork 方式运行 script 时, 就是让 shell(parent process) 产生一个 child process 去执行该 script, 当 child proc ...
- bash快捷键及输入输出重定向
bash特性之快捷键: Ctrl+a: 跳转至命令首部 Ctrl+e: 跳转至命令尾部 Ctrl+l: 清屏 Ctrl+c: 中止或取消 Ctr ...
- HDU 3516 DP 四边形不等式优化 Tree Construction
设d(i, j)为连通第i个点到第j个点的树的最小长度,则有状态转移方程: d(i, j) = min{ d(i, k) + d(k + 1, j) + p[k].y - p[j].y + p[k+1 ...
- js中的this关键字
this是Javascript语言的一个关键字它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用,下面分四种情况,详细讨论this的用法 this是Javascript语言的一个关键字. 它 ...
- selenium常见控件操作
下拉选择框 第一种方法:from selenium.webdriver.support.select import Select# 实例化一个Select类的对象 selector = Select( ...
- numpy hstack()
numpy.hstack(tup)[source] Stack arrays in sequence horizontally (column wise). Take a sequence of ar ...
- 【java基础 6】java的发展史简介
结合到近期在做springboot框架开发遇到的关于jdk版本的问题,本篇博客,主要介绍一下java的发展历史,侧重纯文介绍每个版本的特性.--主要从理论上做个宏观的了解,不做具体的技术研究讨论! 一 ...
- 【JavaScript 1—基础知识点】:宏观概述
导读:JavaScript是一门新的(也可以说是旧的或者半新语言),里面有很多的知识点都能和已有的知识产生共鸣.但是,虽然简单,相同点也有很多,也有不同点.我脑袋也不好使,所以对于我来说,还是有必要再 ...
- 谈Elasticsearch下分布式存储的数据分布
对于一个分布式存储系统来说,数据是分散存储在多个节点上的.如何让数据均衡的分布在不同节点上,来保证其高可用性?所谓均衡,是指系统中每个节点的负载是均匀的,并且在发现有不均匀的情况或者有节点增加/删除 ...