publish

消息订阅-发布机制（PubSubJs）

⽤法：

1.⼯具库:PubSubJS

2.下载:npminstallpubsub-js--save

3.使⽤:

PubSubfrom'pubsub-js'//引⼊

ibe('delete',function(data){});//订阅

h('delete',data)//发布消息

例⼦

可以实现任意组件的通信

⽐如A组件想给B组件发送消息，B组件⽤ibe订阅⼀个名为UpdateList的事件，并且当这个事件被发布的时候会调⽤

ibe的第⼆个参数的函数：

第⼀个参数是订阅的事件

第⼆个参数是别⼈发布了订阅以后执⾏的函数，接收的meg是时间名字UpdateList,data是别⼈发布订阅传递过来的数据

componentDidMount(){

=ibe('UpdateList',(meg,data)=>{

te({...data});

})

}

//第⼀个参数是订阅的事件

//第⼆个参数是别⼈发布了订阅以后执⾏的函数

//接收的meg是时间名字UpdateList,data是别⼈发布订阅传递过来的数据

这个时候假设A想传新数据给B，A组件利⽤h发布UpdateList这个事件，并且把需要穿过去的数据放在第⼆个参数

中：

h('UpdateList',{urs:,Loading:fal});

当B组件要卸载的时候，记得取消订阅

componentWillUnmount(){

cribe()

}

图解：

设计状态时要考虑全⾯，例如带有⽹络请求的组件，要考虑请求失败怎么办。

ES6⼩知识点：解构赋值+重命名

letobj={a:{b:1}}

const{a}=obj;//传统解构赋值

const{a:{b}}=obj;//连续解构赋值

const{a:{b:value}}=obj;//连续解构赋值+重命名

消息订阅与发布机制

1.先订阅，再发布（理解：有⼀种隔空对话的感觉）

2.适⽤于任意组件间通信

3.要在组件的componentWillUnmount中取消订阅

fetch发送请求（关注分离的设计思想）

try{

constrespon=awaitfetch(`/api1/arch/urs2?q=${keyWord}`)

constdata=()

(data);

}catch(error){

('请求出错',error);

}

参考链接：