RxJS在TypeScript中的简单使用详解
1.安装
#安装typescript，rxjs包 npminstall-Dtypescript@types/node npminstallrxjs
2.使用
2.1使用from来从数组生成源
RxJS有许多创建源的方法，如from,fromEvent...,这里使用from做个例子
import{from}from'rxjs'
//从数组生成可订阅对象
//obser的对象类型为Observable
letobser=from([1,2,3,4,5])
//消费对象
//next当管道中有值流动，就会出发next
//当发生错误是会触发error
//当循环完数组时，会调用complete
obse.subscribe({
next(item){
console.log(item)
},
error(err){
console.log(err)
},
complete(){
console.log("Done")
}
}
2.2自定义生成源
import{Observable,from}from'rxjs'
//新建一个可订阅对象
letobser=newObservable(productor=>{
//自定义数据流
productor.next("hello")
productor.next("world")
setTimeout(()=>{
productor.next("After1Sec")
productor.complete()
},1000)
})
//消费
obse.subscribe({
next(item){
console.log(item)
},
error(err){
console.log(err)
},
complete(){
console.log("Done")
}
}
3.实际例子，使用Redis
3.1安装Redis
npminstallredis@types/redis
3.2使用
import{RedisClient}from"redis"
import{Observable}from"rxjs"
//连接redis,redisclient的构造类型是”ClientOpt接口“，只要是符合其字段定义的对象就可以
letreids=newRedisClient({
host:"localhost",
port:6379
})
//redis的操作都是异步操作，通过回调使用，很容易陷入毁掉地狱
redis.set("name","tom",(err,res)=>{
//需要在set成功后同步的操作
if(!err){
redis.get("name",(err,res)=>{
console.log(res)
})
}
})
//可以使用Promise封装上面的方法，但我们这里使用rxjs的事件流
letredisObser=newObservable(productor=>{
//这个列子没啥实际用途，只做演示
redis.set("name","jack",(err,res)=>{
productor.next(res)
productor.complete()
})
})
//消费代码
obse.subscribe({
next(key){
//读取或其他需保证在set后的操作
redis.get(key,(err,res)=>{
console.log(res)
})
},
error(err){
console.log(err)
},
complete(){
console.log("QueryFinish")
}
}
到此这篇关于RxJS在TypeScript中的简单使用详解的文章就介绍到这了,更多相关TypeScript使用RxJS内容请搜索毛票票以前的文章或继续浏览下面的相关文章希望大家以后多多支持毛票票！