使用 ipc 渲染器从 mongodb 和 electron js 获取数据答案

【问题标题】：fetching data from mongodb and electron js using ipc renderer使用 ipc 渲染器从 mongodb 和 electron js 获取数据
【发布时间】：2019-11-16 17:08:09
【问题描述】：

vue 文件

this.$electron.ipcRenderer.send('get-result')
      this.$electron.ipcRenderer.on('got-it', (event, data) => {
        if (data.status) {
          this.allResult = data.result
        }
        else{
          this.allResult = ''
        }
      })

渲染文件

ipcMain.on('get-result', (event) => {
    todolist.find({}, null, {sort: { creationDate: -1 }}, (err, result) => {
        if (!err && result.length) {
            event.sender.send('got-it', {
                status: true,
                result: result
            });
        } else {
            event.sender.send('got-it', {
                status: false
            });
        }
    });
});

IN CMD 结果看起来像这样就可以了

[ { _id: 5dd01fff35ad336558153f8c,
      notes: 'hello 3',
      creationDate: 2019-11-16T16:12:47.190Z,
      __v: 0 },
    { _id: 5dd01efdca8cdf61daa07fcf,
      notes: 'Hello Again',
      creationDate: 2019-11-16T16:08:29.190Z,
      __v: 0 },
    { _id: 5dd01d7a2a4b995f68d36f7c,
      notes: 'Hello Mongo Atlas',
      creationDate: 2019-11-16T16:02:02.998Z,
      __v: 0 },
    { _id: 5dd01c72d43db25eb93c0267,
      notes: 'hello mongo',
      creationDate: 2019-11-16T15:57:38.799Z,
      __v: 0 } ]

但是从渲染器浏览器控制台获取结果后看起来像这样

0:$__:(...)
$init:(...)
$locals:(...)
isNew:(...)
_doc:(...)
__ob__
:Observer {value: {…}, dep: Dep, vmCount: 0}
get $__:ƒ reactiveGetter()
set $__:ƒ reactiveSetter(newVal)
get $init:ƒ reactiveGetter()
set $init:ƒ reactiveSetter(newVal)
get $locals:ƒ reactiveGetter()
set $locals:ƒ reactiveSetter(newVal)

最终结果在每个索引的 _doc 下，例如 0、1、2 这是为什么？我认为它应该只返回简单的数组，例如 CMD 的 打印结果。这是要获取组织结果还是我需要做其他事情？

谢谢

【问题讨论】：

在你的 Vue 实例上声明了 allResult 吗？
是的。 allResult 在 data() 中声明，它基本上是一个 array()
顺便说一下，this.allResult不会出现这个问题。 cz，从渲染器文件中获取结果后，它会在浏览器控制台上显示上述结果。

标签： mongodb vue.js electron

【解决方案1】：

忽略这种格式的最好方法是，在从 DB 编码的 json 中获取结果之后，然后是字体端解码 json 格式，这将产生期望的结果。像这样-

render.js

ipcMain.on('get-result', (event) => {
    todolist.aggregate([
        {
            $sort:{
                _id:-1
            }
        }
    ])
    .exec((err, result) => {
        if (!err && result.length) {
            event.sender.send('got-it', {
                status: true,
                result: JSON.stringify(result)
            });
        } else {
            event.sender.send('got-it', {
                status: false
            });
        }
    });
});

组件.vue

this.$electron.ipcRenderer.send('get-result')
      this.$electron.ipcRenderer.on('got-it', (event, data) => {
        if (data.status) {
          this.allResult = JSON.parse(data.result)
        }
        else{
          this.allResult = ''
        }
      })

【讨论】：