vue如何调用node path模块并在页面显示路径

在Vue中调用Node.js的path模块来操作路径也是可以的。具体步骤如下：

1. 在Vue项目中引入Node.js的path模块：`const path = require('path');`

2. 在Vue组件中定义一个方法来获取路径：

methods: {
  getPath() {
    // 获取当前目录的绝对路径
    const dirPath = path.resolve(__dirname);
    // 获取文件的绝对路径
    const filePath = path.resolve(__dirname, 'example.txt');

    // 将路径绑定到页面上
    this.dirPath = dirPath;
    this.filePath = filePath;
  }
}

这里的`__dirname`是Node.js中的一个全局变量，表示当前模块所在的目录的绝对路径。`path.resolve`方法可以将多个参数拼接成一个绝对路径。

3. 在Vue组件的data中定义两个变量来存储路径：

data() {
  return {
    dirPath: '',
    filePath: ''
  }
}

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

mounted() {
  this.getPath();
}

5. 在Vue组件的模板中将路径绑定到页面上：

<div>
  <p>当前目录的路径：{{ dirPath }}</p>
  <p>文件的路径：{{ filePath }}</p>
</div>

这样就可以在Vue页面中调用Node.js的path模块并显示路径了。需要注意的是，在Vue项目中前端和后端是分离的，不能直接使用`__dirname`来获取路径，需要将路径从后端API中获取。