我应该如何为 Vuejs 设置服务器发送的事件?
How should I set up a server sent event for Vuejs?
有人可以帮我提供有关如何设置 服务器发送事件 的建议吗?
我制作了一个小型出价应用程序,其中 auctionedItems
出现在以下组件中:
<div v-for="item in auctionedItems">
<Item :info="item"></Item>
</div>
auctionedItems
数组来自服务器 (Express.js) get
响应。每个 auctionedItem
包含 maximumBid
值。
假设有人对其中一项出价 => auctionedItem
的 maximumBid
在服务器中发生更改并广播给用户。
我如何在 Vue 和 Express 中设置它?
您希望在整个应用程序中维护状态,并且每个服务器事件都会影响多个组件。使用 Vuex,Vue 的状态管理器(就像 React 的 Redux)。
您的应用程序将 auctionedItems
存储在 Vuex 中(最好在 "module" 中。您的组件将使用该 Vuex 状态作为计算 属性,就好像它存在于您的组件。您将编写会影响您的状态的突变(如果同步)或操作(如果需要额外的异步调用)。
示例突变可以是:
updateItem(state, newItem)
每当您的服务器将该事件推送到带有更新项目的客户端时,您就会调用 vuex store.commit('updateItem', itemFromServer)
,它会更新 Vuex 状态,然后传播到整个 Vue 应用程序,影响使用该状态的任何组件。
客户端到服务器由您决定。您可以轮询 Express 或使用 WebSocket 进行推送。此答案仅供您的 Vue 客户端处理 "server sent event".
有人可以帮我提供有关如何设置 服务器发送事件 的建议吗?
我制作了一个小型出价应用程序,其中 auctionedItems
出现在以下组件中:
<div v-for="item in auctionedItems">
<Item :info="item"></Item>
</div>
auctionedItems
数组来自服务器 (Express.js) get
响应。每个 auctionedItem
包含 maximumBid
值。
假设有人对其中一项出价 => auctionedItem
的 maximumBid
在服务器中发生更改并广播给用户。
我如何在 Vue 和 Express 中设置它?
您希望在整个应用程序中维护状态,并且每个服务器事件都会影响多个组件。使用 Vuex,Vue 的状态管理器(就像 React 的 Redux)。
您的应用程序将 auctionedItems
存储在 Vuex 中(最好在 "module" 中。您的组件将使用该 Vuex 状态作为计算 属性,就好像它存在于您的组件。您将编写会影响您的状态的突变(如果同步)或操作(如果需要额外的异步调用)。
示例突变可以是:
updateItem(state, newItem)
每当您的服务器将该事件推送到带有更新项目的客户端时,您就会调用 vuex store.commit('updateItem', itemFromServer)
,它会更新 Vuex 状态,然后传播到整个 Vue 应用程序,影响使用该状态的任何组件。
客户端到服务器由您决定。您可以轮询 Express 或使用 WebSocket 进行推送。此答案仅供您的 Vue 客户端处理 "server sent event".