📅  最后修改于: 2020-10-20 05:37:25             🧑  作者: Mango
在本章中,我们将看到如何将RxJ与ReactJS一起使用。我们不会在这里进入Reactjs的安装过程,要了解关于ReactJS安装的信息,请参考以下链接: /reactjs/reactjs_environment_setup.htm
我们将直接在下面的示例中工作,在该示例中,将使用RxJS中的Ajax加载数据。
import React, { Component } from "react";
import ReactDOM from "react-dom";
import { ajax } from 'rxjs/ajax';
import { map } from 'rxjs/operators';
class App extends Component {
constructor() {
super();
this.state = { data: [] };
}
componentDidMount() {
const response = ajax('https://jsonplaceholder.typicode.com/users').pipe(map(e => e.response));
response.subscribe(res => {
this.setState({ data: res });
});
}
render() {
return (
Using RxJS with ReactJS
{this.state.data.map(el => (
-
{el.id}: {el.name}
))}
);
}
}
ReactDOM.render( , document.getElementById("root"));
ReactJS Demo
我们使用了RxJS中的ajax,它将从此网址( https://jsonplaceholder.typicode.com/users)加载数据。
编译时,显示如下-