阵营之外使用功能的方法

我有一些功能，我需要让我把他们像这样的一个模块中的若干组件使用。阵营之外使用功能的方法

export default class FormFunctions { 
    handleChange (event) { 
    const changedOne = event.target.name 
    const newValue = event.target.value 
    const newState = {} 
    newState[changedOne] = newValue 
    this.setState(newState) 
    } 
    handleSubmit (infoToPass, toThisMethod) { 
    Meteor.call(toThisMethod, infoToPass, function() { 
     console.log('userCreate call callback') 
    }) 
    } 
}

如何将它们用作我的组件的方法？

我试过这样，但它不工作。而且我不确定我是否需要任何课程。

import React, { Component } from 'react' 
import Register from './Register.jsx' 
import FormFunctions from './FormFunctions' 

class RegisterLogic extends Component { 

    render() { 
    return <Register 
     handleChange={this.handleChange} 
     handleSubmit={this.handleSubmit} 
     /> 
    } 
} 

export default RegisterLogic

来源

2016-12-29 Hayk Safaryan

您可以通过两个小修改了代码，使这项工作：而不是this.handleChange的

，你将不得不使用FormFunctions.handleChange。为了能够从类指的功能，你可以添加静态它的定义：static handleChange (event) {或创建和使用类的一个对象。
无论出于何种原因，您可以拨打.bind(this)来告诉可用于某些功能的反应组件，因此您的代码将变为handleChange={FormFunctions.handleChange.bind(this)}。

希望这会有所帮助。

来源

2016-12-29 08:45:19

1.不能工作，因为你不能在静态中访问'this'。这就是为什么他们是静态的。 –

我试过这个，它实际上工作！ –

你可以把函数放在一个更高的组件中并传递它们吗？基本上lift the state up如果逻辑将在多个相同。

有一种方法可以将它们作为util文件中的函数提取出来，然后将它们绑定到您的类上，但我不建议这样做，我发现使用像Redux这样的状态管理文件会更好（小文件大小和其他巨大的好处）。

如果使用状态管理系统，如终极版，那么你可以有setState功能减速器（只是一个正常的功能）。然后，您可以从该减速器调用其他减速器，并且此逻辑可用于您希望的所有组件。

来源

2016-12-29 08:43:55

我没有学到终极版尚未解除但状态似乎达到了坚实的和官方的解决了这个，但我不知道怎么用它做反应路由器，也许你可以提供一个例子吗？我没有使用过 –

@HaykSafaryan阵营路由器 –

似乎是有问题的大量的阵营路由器这个没有官方的解决方案了。 –

阵营之外使用功能的方法

回答

相关问题