vue如何调用node Api并在页面显示

在Vue中调用Node.js API可以通过axios库向后端发送http请求来实现。具体步骤如下：

1. 在Vue项目中安装axios库：`npm install axios --save`

2. 在Vue组件中引入axios：`import axios from 'axios';`

3. 在Vue组件的methods中定义一个方法来调用后端API：

methods: {
  fetchData() {
    axios.get('/api/data')
      .then(response => {
        // 处理从后端返回的数据
        console.log(response.data);
        // 将数据绑定到页面上
        this.data = response.data;
      })
      .catch(error => {
        console.log(error);
      });
  }
}

这里的`/api/data`是后端API的地址，可以根据实际情况修改。`response.data`是从后端返回的数据，可以根据实际情况进行处理。`this.data`是Vue组件中的一个data属性，可以将数据绑定到页面上。

4. 在Vue组件的mounted钩子中调用定义好的方法：

mounted() {
  this.fetchData();
}

这样就可以在Vue页面中调用Node.js API并显示数据了。需要注意的是，在Vue项目中前端和后端是分离的，需要将后端API的地址配置到Vue项目中的配置文件中（如vue.config.js或者.env文件）。