javascript - 在父组件或子组件中放置方法的位置？

Question

我正在用 React 构建一个网站，我想知道在放置 JS 函数方面更好的做法是什么。如果我有一个方法 doSomething() 并且在一个组件的多个实例中使用 doSomething() ，放置 doSomething() 会更好吗> 在子组件中，还是在父组件中？如果它在父组件中，那么遵循代码会有点困难，而如果它在子组件中，则会检索多个相同的方法(即调用子组件的每个实例一个)。

即这个更好吗:

export default class Parent extends Component{

    doSomething(){...}

    render(){
        return(
            <Child />
            <Child />
            <Child />
        ) }

}

或者这个:

export default class Parent extends Component{

    render(){
        return(
            <Child />
            <Child />
            <Child />
        ) }

}


class Child extends Component{

    doSomething(){...}

    render(){
        return(
            <p>This is the child component</p>
        )

    }

}

Answer 1

如果仅在 Child 实例中使用，我会将该方法放在 Child 类中。

“而如果它在子组件中，则会检索到多个相同的方法。”

您在上面的 child 中声明 doSomething() 的方式并没有使其成为实例方法。

doSomething() 方法将成为 Child 原型(prototype)的属性，它的引用将被所有实例共享。

要使 doSomething 成为实例方法，您必须在 Child 构造函数中定义类似 this.doSomething = function(){... 的内容。

(另一个异常(exception)是，如果您将 doSomething() 声明为 Child 类的构造函数的 static 方法)。