我是 React js 的新手,我的问题是我想创建一个类,它将作为我想在另一个类或组件中使用的全局助手。
用例例如,如果用户选择任何餐厅,首先我想获取用户输入的所有餐厅列表关键字,然后我想获取餐厅详细信息。在这个用例中,我必须进行两次 ajax 调用,我想创建可以在其他组件中使用的全局 ajax 辅助函数。
class AjaxHelperClass{
ResturantAPI(url){
$.ajax({
url : url,
success : function(res){}
});
}
}
export default AjaxHelperClass;
在我使用 AjaxHelperClass 函数的另一个组件中:
import React from 'react';
import {render} from 'react-dom';
import {AjaxHelperClass} from "./module/AjaxHelperClass"
class App extends React.Component {
constructor(props) {
super(props);
/// AjaxHelperClass.ResturantAPI(); // or
let myajaxresult= new AjaxHelperClass(url);
}
render () {
return(
<p> Hello React!</p>
);
}
}
render(<App/>, document.getElementById('app'));
最佳答案
创建一个名为 helpers.js
的文件>
//helpers.js
export const AjaxHelper = (url) => {
return (
//ajax stuff here
);
}
然后在你的组件中:
import React from 'react';
import {render} from 'react-dom';
import {AjaxHelper} from "./path/to/helpers.js"
class App extends React.Component {
constructor(props) {
super(props);
let myajaxresult = AjaxHelper(url);
}
render () {
return(
<p> Hello React!</p>
);
}
}
关于javascript - 如何使用另一个组件使用的 ES6 在 React JS 中创建通用帮助程序类?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41949768/