Vue.js使用模板中调用的方法的返回值

2024-05-05 • 问答

我想使用从模板内部调用的函数返回的值。

模板：

<div class="director">
    {{ fetchDirector(movie.imdbId) }}
</div>

vue.js：

async fetchDirector(movieId) {
    try {
        await axios.post(`http://www.omdbapi.com/?i=${movieId}&apikey=...`)
        .then((res) => {
            return ( res.data.Director )
        })
     } catch(err) {
        console.log(err);
     }
}

我不知道如何显示fetchDirector(movie.imdbId)给出的[object Promise]值。谢谢！

.then((res) => {
  return ( res.data.Director )
})

示例中的箭头功能返回该值，但对任何内容均无效。而不是从此函数返回，而是在组件上定义一个data属性（例如，命名为director），然后代替从此箭头函数返回，将获取的值分配给data属性，例如这个：

data () {
  return {
    director: ''
  }
},mounted () {
  axios.post(`http://www.omdbapi.com/?i=${movieId}&apikey=...`)
    .then(res) => {
      this.director = res.data.Director;
    })
}

并在模板中呈现值：

<div class="director">
  {{ director }}
</div>

Vue.js使用模板中调用的方法的返回值

a469096355 回答：Vue.js使用模板中调用的方法的返回值

大家都在问