陣營之外使用功能的方法

我有一些功能，我需要讓我把他們像這樣的一個模塊中的若干組件使用。陣營之外使用功能的方法

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陣營路由器 –

似乎是有問題的大量的陣營路由器這個沒有官方的解決方案了。 –

陣營之外使用功能的方法

回答

相關問題