ios如何调用别人服务器上的js函数来读取网站数据,如何访问从axios返回的数据使用react js显示在网页上?...
以下是使用React和ES2015进行操作的一种方法。 您将需要在构造函数中设置默认状态,并像下面的示例中那样获取请求。只需切换名称以使其与您的应用程序一起工作。然后映射您从get请求的响应中返回的数组。当然,改变名称和样式以满足您的需求,我使用Bootstrap使事情易于理解。希望这可以帮助。import React, { Component } from 'react'import axios
以下是使用React和ES2015进行操作的一种方法。 您将需要在构造函数中设置默认状态,并像下面的示例中那样获取请求。只需切换名称以使其与您的应用程序一起工作。然后映射您从get请求的响应中返回的数组。当然,改变名称和样式以满足您的需求,我使用Bootstrap使事情易于理解。希望这可以帮助。
import React, { Component } from 'react'
import axios from 'axios';
import cookie from 'react-cookie';
import { Modal,Button } from 'react-bootstrap'
import { API_URL, CLIENT_ROOT_URL, errorHandler } from '../../actions/index';
class NameofClass extends Component {
constructor(props) {
super(props)
this.state = {
classrooms: [],
profile: {country: '', firstName: '', lastName: '', gravatar: '', organization: ''}
}
}
componentDidMount(){
const authorization = "Some Name" + cookie.load('token').replace("JWT","")
axios.get(`${API_URL}/your/endpoint`, {
headers: { 'Authorization': authorization }
})
.then(response => {
this.setState({
classrooms:response.data.classrooms,
profile:response.data.profile
})
})
.then(response => {
this.setState({classrooms: response.data.profile})
})
.catch((error) => {
console.log("error",error)
})
}
render() {
return (
NameofClass Page
Welcome {this.state.profile.firstName} {this.state.profile.lastName}
{
this.state.classrooms.map((room) => {
return (
{room.name}
)
})
}
)
}
}
export default NameofClass
更多推荐
所有评论(0)