Javascript 如何将axios响应数据提取到vuejs中的变量中

我试图实现与Vue中的

…mapState（）

函数相同的功能

我有一个axios请求，它返回一个具有不同道具的对象，如下所示：

axios.get(
 '/'
).then(
 res => {
  console.log(res) // {name: 'foo', age: 22, height: '1.72m', job: 'developer'}
 }
)

现在，我可以用与

…mapState（）

相同的方法提取道具，以便在模板中使用它们，如：

<template>
 <div> 
  Hello My name is {{name}} and I am {{age}} years old
 </div>
</template>

你好，我叫{{name}，今年{{age}岁

我正在考虑将响应对象分配给vuejs数据，但我不想重新写入其他变量

您可以尝试以下方法：

axios.get(
 '/'
).then(
 res => {
  console.log(res) // {name: 'foo', age: 22, height: '1.72m', job: 'developer'}
  return { index: res}
 }
)

然后您可以访问数据

<template>
 <div> 
  Hello My name is {{index.name}} and I am {{index.age}} years old
 </div>
</template>

你好，我的名字是{index.name}，我是{{index.age}岁

这似乎比我得到的其他（删除的）答案要好。但是你确定它有效吗？没有任何东西绑定到全局变量。我不知道你的意思吗？使用{index.name}获取值console.log（res）的确切结果是什么？响应正常，只是插值不起作用