Question

我正在努力解决我在几个组件类中使用的一些函数。 Mixins是不行的，我很难理解我应该使用什么替代品。将代码设置为模块似乎很有希望，但我不明白如何打包它所以我可以用它来扩展几个不同的类。

说我有：

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

但是如何使用共享类扩展我的组件？如果我在类声明中声明它，就像my components一样，可以扩展React.Component来破坏可重用性......是否有另一种方法我应该关注？

Answer 1

您可以将共享函数文件创建为具有多个需要使用的函数的文件，每个函数都作为命名导出导出。像这样：

export function thingToDo() {
    ...
}

export function getUserByEmail(email) {
    ...
}

例如，将此文件另存为functionsToShare.js。

然后在每个React组件类（或其他任何地方）中，您可以导入该函数，只需输入：

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

React ES6类之间的代码共享

1 个答案: