React ES6类之间的代码共享
问题描述:
我正在努力干掉我使用的几个函数,这些函数涉及几个我的组件类。 Mixins是一个不行,我正在努力了解我应该使用什么替代方案。将代码设置为模块似乎很有前途,但我不明白如何打包它,以便我可以使用它来扩展几个不同的类。React ES6类之间的代码共享
说我有:
class functionsToShare {
thingToDo(){
//do a thing
}
}
export default functionsToShare;
我假设在我的组件类我想要的东西,如:
import React from 'react';
import functionsToShare from 'some/path'
class SomeComponent extends React.Component{
constructor(props){
super(props);
}
render(){
return (
);
}
}
export SomeComponent
但是我怎么使用共享类致以组件?如果我在类声明中声明它像mycomponent被扩展为React.Component那样会挫败可重用性......是否有另一种方法我应该看?
答
您可以将您的共享函数文件创建为具有多个需要使用的函数的文件,并将每个函数导出为命名导出。像这样:
export function thingToDo() {
...
}
export function getUserByEmail(email) {
...
}
将此文件另存为例如functionsToShare.js
。
随即反应过来组件类(或其他地方),你可以导入功能,只是你需要的:
import {thingToDo} from "./functionsToShare"; // import a function
thingToDo(); // call function
或所有这些:
import * as somename from "./functionsToShare"; // import all functions from that file
somename.thingToDo(); // call specific function
你能不能只是做'functionsToShare.thingToDo()'? – Chris
我想我可以。在这种情况下,这将很好地工作。 有没有办法扩展类,以便模块类引入新的实例方法或扩展类的原型函数? –