Nuxt js：如何在模板中显示Promise的结果？

Question

我尝试在模板中显示{{ bgColor }}。但是它仅显示[object Promise]] >>

const { getColorFromURL } = require('color-thief-node')

  export default {
    data() {
      return {
        api_url: process.env.strapiBaseUri,
        bgColor: this.updateBgColor(this.project),
      }
    },
    props: {
      project: Object,
    },
    methods: {
      updateBgColor: async function(project){
        return await getColorFromURL(process.env.strapiBaseUri+this.project.cover.url).then((res) => {
          const [r, g, b] = res
          console.log( `rgb(${r}, ${g}, ${b})` )
          return `rgb(${r}, ${g}, ${b})`
        })
      }
    }
  }
该函数看起来可以正常工作，因为我在console.log上得到了结果

rgb(24, 155, 97)
我认为我在方法，插件和异步功能的使用之间迷路了。

任何帮助表示赞赏！

我尝试在模板中显示{{bgColor}}。但是它仅显示[object Promise] const {getColorFromURL} = require（'color-thief-node'）export default {data（）{return {...

Answer 1

https://forum.vuejs.org/t/render-async-method-result-in-template/36505/3