[Vue-rx] Access Events from Vue.js Templates as RxJS Streams with domStreams
The domStreams component property enables you to access Events from your Vue.js templates as Streams insides your subscriptions function. You can then map the Events to other values and stream them back into your Vue.js templates.
<template>
<section class="section">
<button class="button" v-stream:click="click$">Click</button>
<h1 class="title">{{random$}}</h1>
</section>
</template> <script>
import { Observable } from "rxjs" export default {
domStreams: ["click$"],
subscriptions() {
const random$ = this.click$.map(() =>
Math.random()
) return {
random$
}
}
}
</script>
[Vue-rx] Access Events from Vue.js Templates as RxJS Streams with domStreams的更多相关文章
- Vue项目中使用基于Vue.js的移动组件库cube-ui
cube-ui 是滴滴公司的技术团队基于 Vue.js 实现的精致移动端组件库.很赞,基本场景是够用了,感谢开源!感谢默默奉献的你们. 刚爬完坑,就来总结啦!!希望对需要的朋友有小小的帮助. (一)创 ...
- 【vue】vue +element 搭建项目,将js函数变成vue的函数
demo:时间转换 1.目录 <1>在src文件夹下新建文件夹prototypefns--------在此文件夹创建util.js, <2>在prototypefns下新建文件 ...
- Vue学习第一天:Vue.js指令系统
1. 如何使用Vue.js? 1.1 直接引入 - <script src="./statics/vue.min.js"></script> - 引入之后在 ...
- vue之注册自定义的全局js方法
前端开发的时候,总会需要写一些js方法,在vue框架中为了方便使用,可以考虑注册一个全局的js方法,下面是注册步骤: 1.0 可以在assets文件中的js文件下面新建一个js文件,如:yun.js- ...
- Vue项目零碎知识(全局js,css配置,element-UI,bs使用, img动态配置,js数组)
全局css样式,首先在静态assets中写好文件,然后要在main.js中配置 // 配置全局css样式 // import '@/assets/css/global.css' require('@/ ...
- 基于Vue.js PC桌面端弹出框组件|vue自定义弹层组件|vue模态框
vue.js构建的轻量级PC网页端交互式弹层组件VLayer. 前段时间有分享过一个vue移动端弹窗组件,今天给大家分享一个最近开发的vue pc端弹出层组件. VLayer 一款集Alert.Dia ...
- Vue源码学习1——Vue构造函数
Vue源码学习1--Vue构造函数 这是我第一次正式阅读大型框架源码,刚开始的时候完全不知道该如何入手.Vue源码clone下来之后这么多文件夹,Vue的这么多方法和概念都在哪,完全没有头绪.现在也只 ...
- Vue源码分析(二) : Vue实例挂载
Vue源码分析(二) : Vue实例挂载 author: @TiffanysBear 实例挂载主要是 $mount 方法的实现,在 src/platforms/web/entry-runtime-wi ...
- Vue源码学习二 ———— Vue原型对象包装
Vue原型对象的包装 在Vue官网直接通过 script 标签导入的 Vue包是 umd模块的形式.在使用前都通过 new Vue({}).记录一下 Vue构造函数的包装. 在 src/core/in ...
随机推荐
- 微信小程序后台获取用户的opeid
1.微信小程序后台获取登录用户的openid,首先微信小程序将code传给后台服务器 wx.login({ success: function (res) { var code = res.code ...
- Django models的诡异异常RelatedObjectDoesNotExist
models代码如下: class Course(models.Model): name = models.CharField(unique=True, max_length=64) price = ...
- 【Codeforces1117C_CF1117C】Magic Ship(构造)
题目: Codeforces1117C 考的时候很困,开局半小时后才过A,只做出来AB,排名3000+,掉了119--半夜体验极差. 翻译: 你是一个船长.最初你在点 \((x_1,y_1)\) (显 ...
- web api初学
据说web api的作用和wcf的一样,只是比wcf更简单而已,具体如何我也不清楚,毕竟不是做学术研究的,我只是通过简单的例子来学习web api.能做的只需要知其然,不必管其所以然.当然有兴趣的可以 ...
- vue-cli 打包优化
1. 优化打包体积 先上2个图 (上图A是优化前的各个js大小对比视图,下图B是优化后,还未完全优化完成的,不过也可以看得出来对比) 图A是3个压缩文件,包括部分图片和使用的所有js,体积都偏大 图B ...
- 批量建文件夹【win7企业版】
在记事本中notepad.exe按如下格式编辑好 md + 空格 + 文件夹名字(多个之间用空格隔开) 保存为.bat格式,运行即可批量创建文件夹.
- android fragment轻松监听返回键/Fragment中的popupwindow响应返回键隐藏
现在的开发我们基本上都是一个主activity中放多个fragment,点击返回按钮的时候,直接退出主activity,但是我们在fragment中经常会弹出例如popupWindow这样的布局,用户 ...
- Java 中访问数据库的步骤?Statement 和PreparedStatement 之间的区别?
Java 中访问数据库的步骤?Statement 和PreparedStatement 之间的区别? Java 中访问数据库的步骤 1)注册驱动: 2)建立连接: 3)创建Statement: 4)执 ...
- Coding iOS客户端应用源码
Coding是国内的一家提供Git托管服务的产品,它们的客户端提供了项目和任务管理.消息和用户中心,以及一个类似论坛的功能,已经在App Store上线: https://itunes.apple.c ...
- CentOS7配置VSFTP服务器
[1] 安装VSFTP [root@localhost ~]# yum -y install vsftpd [2] 配置vsftpd.conf文件 [root@localhost ~]# vi /et ...