javascript - 如何在 VueJS 的 promise 中设置数组对象属性的值？

Question

我正在使用 feathersjs与 feathers-client使用 VueJS，我得到一个 Cannot set property 'employees' of undefined 类型错误。这是我的代码:

<template>
  <ul>
    <li v-for="employee in employees">{{employee.name}}</li>
  </ul>
</template>

<script>
import feathers from 'feathers/client'
import socketio from 'feathers-socketio/client'
import hooks from 'feathers-hooks'
import io from 'socket.io-client'

const socket = io('localhost:3030')
var app = feathers().configure(hooks())
                    .configure(socketio(socket))
                    .configure(authentication({ storage: window.localStorage }));

export default {
 data() {
   return {
     employees: []
   }
 },
 mounted() {
     app.authenticate().then(function(response) {
          app.service('users').find().then(function(users) {
            this.employees = users.data
          })
        }, function(error) {
          console.log(error)
        })
   }
}

</script>

当我运行它时，我得到了

Uncaught (in promise) TypeError: Cannot set property 'employees' of undefined

在控制台中。

我是不是做错了什么？

Answer 1

this 内部函数指向那个函数所以

 mounted() {
         var self = this; //add this line
         app.authenticate().then(function(response) {
              app.service('users').find().then(function(users) {
                self.employees = users.data //change this to self
              })
            }, function(error) {
              console.log(error)
            })
       }
    }