vue写一个后端数据变化前端实时改变页面不用websocket

如果不使用 WebSocket，也可以使用 Vue.js 提供的双向数据绑定来实现后端数据变化前端实时改变页面的效果。

具体步骤如下：

1. 在后端使用轮询（Polling）或者 Server-Sent Events（SSE）等技术，将数据推送到前端。

2. 在前端使用 Vue.js，将推送过来的数据绑定到 Vue 实例的数据上。

3. 当数据发生变化时，Vue.js 会自动更新页面中对应的数据。

示例代码如下：

<template>
  <div>
    <p>当前时间：{{ serverTime }}</p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      serverTime: ''
    }
  },
  mounted() {
    setInterval(() => {
      // 使用 axios 发送 GET 请求，获取后端数据
      axios.get('/api/time').then(response => {
        this.serverTime = response.data;
      });
    }, 1000);
  }
}
</script>

在上面的示例中，每隔一秒钟，前端会向后端发送一个 GET 请求，获取服务器的时间，并将其绑定到 Vue 实例的 serverTime 数据上。当服务器的时间发生变化时，Vue.js 会自动更新页面中对应的数据。

需要注意的是，使用轮询或者 SSE 等技术来实现实时更新页面的效果，会增加服务器的负载和网络带宽的消耗，因此需要根据实际情况进行权衡和优化。同时，在使用 SSE 技术时，需要注意浏览器的兼容性。