React.js中的对象格式



我试图呈现一个从api返回项描述的组件。在这个例子中,我从DnD API返回咒语,并试图访问每个咒语的url以显示它们的描述。到目前为止,下拉菜单的端点工作正常。我正在尝试将返回的内容格式化为另一个端点,以便与我的描述组件一起使用。我有一个叫做";selectedSpell"在下拉列表中列出了使用的内容。现在我只得到一个对象,我不知道如何变成我想要的字符串。我希望我能理解我想做的事😓

这就是我的工作。

import {useState , useEffect} from 'react'
import axios from 'axios';
export default function Description (props){
const { selectedSpell } = props
console.log(props)
const [description, setDescription] = useState([]);
const fetchDesc = async () => {
try {
const DESC_URL = "{https://www.dnd5eapi.co/{props.selectedSpell}";
const response = await axios.get(DESC_URL);
console.log("response", response.data.results);
setDescription(response.data.results);
console.log(description)
} catch (error) {
console.log(error);
}
};
useEffect(() => {
fetchDesc();
}, []);
return(
<div>
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. 
Consectetur nunc, morbi enim, rhoncus lacus duis. 
Tortor amet pulvinar dolor fringilla sit elit ac ut. 
</p>
</div>
)
}

我是新来的,还不能发布图片lol

https://i.stack.imgur.com/iqi9Y.png

我试图让那个描述模块返回一个基于什么的api调用;拼写";选择

这里有一些问题。

DESC_URL

你在那里得到的URL会让你的应用程序请求

/%7Bhttps://www.dnd5eapi.co/%7Bprops.selectedSpell%7D

在您的本地机器上。const DESC_URL =https://www.dnd5eapi.co/${props.selectedSpell};就是您想要的。我不确定那里发生了什么事。

API本身

我建议您阅读他们的文档。有一个令人担忧的url,上面有示例响应。

最新更新