1

我有一个外部 api，它返回一个用户的 json，其中包含一些属性，如用户名。我想在我的 vue 方法中使用这个用户名作为 url 参数并定义函数 getUser()。我的问题是参数未定义

这是我的代码

<script>
import Axios from 'axios-observable'
export default {
  data () {
    return {
      appointments: {},
      event_counter: 0,
      user: ''
  },
  methods: {
    getUser: function () {
      Axios
        .get('http://127.0.0.1:5000/users/get_user')
        .subscribe(response => { this.user = response.data.username })
    },
    getAppointments: function () {
      Axios
        .get('http://127.0.0.1:5000/appointments/get_appointments?user=' + this.user)
        .subscribe(response => { this.appointments = response.data })
    },
    fetchData: function () {
      setInterval(() => {
        this.getAppointments()
      }, 150000)
    }
  },
  mounted () {
    //this.user = this.getUser()
    this.getUser()
    this.fetchData()
  },
  created () {
    //this.user = this.getUser()
    this.getUser()
    this.getAppointments()
  }
}
</script>

我尝试了一些变体return response.data或data: this.getUser()等。在模板中获取用户{{ user }}可以正常工作，但没有帮助。我没有来自 vue/electron-vue 的任何语法或运行时错误

任何的想法？

4

2 回答 2

1

终于有办法了！

<script>
import Axios from 'axios'
export default {
  data () {
    return {
      appointments: {},
      event_counter: 0,
      user: 'test'
    }
  },
  methods: {
    getUser: function () {
      return Axios
        .get('http://127.0.0.1:5000/users/get_user')
        .then(response => {
          this.user = response.data.username
          return this.user
        })
    },
    getAppointments: function () {
      this.getUser()
        .then(data => {
          let url = 'http://127.0.0.1:5000/appointments/get_appointments?user=' + data
          Axios
            .get(url)
            .then(response => { this.appointments = response.data })
        })
    },
    fetchData: function () {
      setInterval(() => {
        this.getAppointments()
      }, 150000)
    }
  },
  mounted () {
    this.fetchData()
  },
  created () {
    this.getAppointments()
  }
}
</script>

解决方案是更改调用getUser()并检索箭头功能块中的日期.then(data =>)。本期@loan 的回答给了我提示：How to set variable outside axios get。

非常感谢大家。

于 2019-10-15T14:05:58.253 回答
0 
<script>
import Axios from 'axios-observable'
export default {
  data () {
    return {
      appointments: {},
      event_counter: 0,
      user: ''
  },
  computed: {
    updatedUrl: {
       return `http://127.0.0.1:5000/appointments/get_appointments?user=${this.user}`
    }

  },
  methods: {
    forceGetUsername() {
        return this.user
    },
    getUser: function () {
      Axios
        .get('http://127.0.0.1:5000/users/get_user')
        .subscribe(response => { this.user = response.data.username })
    },
    getAppointments: function () {
      console.log(updatedUrl)
      Axios
        .get(updatedUrl)
        .subscribe(response => { this.appointments = response.data })
    },
 // Below can remain the same
}
</script>

因此，似乎 url 正在被缓存并且一旦创建就不会更新。所以我添加了新函数来确保返回最新的值。不是很理想。

将 URL 添加到计算属性。如果这不起作用，那么我也会迷路:(

于 2019-10-14T14:53:30.510 回答