我应该如何为 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 值。

假设有人对其中一项出价 => auctionedItemmaximumBid 在服务器中发生更改并广播给用户。

我如何在 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".