Good afternoon, you need to extract props from the store in the calculate component and transfer the results of the calculation with it to the app

app.js

import React, { Component } from 'react'; import { connect } from 'react-redux'; import principalChanged from './src/actions'; import Input from './src/components/common'; import { principal2, principal3 } from './src/components/calculate'; class App extends Component { onPrincipalChange(text) { this.props.principalChanged(text); } render() { return ( <Card> <Input placeholder="Placeholder" label="Label" onChangeText={this.onPrincipalChange.bind(this)} value={this.props.principal} /> `Текущее состояние переменной: ${this.props.principal}`{/n} `Новая переменная: ${principal2}` `Новая переменная: ${principal3}` </Card> ); } } const mapStateToProps = state => { return { principal: state.form.principal }; }; export default connect(mapStateToProps, { principalChanged })(App);

calculate.js

 // вызов переменной principal из store // каким то образом export const principal2 = (principal) => { return ( { principal * 2 } ); // вычисления }; export const principal3 = (principal) => { return ( { principal / 2 } ); // вычисления };

    1 answer 1

    It is not possible to connect Redux (react-redux) to a function. You must always connect it to the component via connect . How it is done in the App.js component.

    What I was looking for is called a selector or selector logic. You just need to call the functions (calculate.js) in the connect (connect) and, thus, embed the necessary calculated values ​​(props) into the component. No need to use mergeProps.

    Solution here

    Alternative (described in the comments on the link above):

    app.js

      import React, { Component } from 'react'; import { connect } from 'react-redux'; import principalChanged from './src/actions'; import Input from './src/components/common'; import { calculate } from './src/lib'; class App extends Component { onPrincipalChange(text) { this.props.principalChanged(text); } render() { const { principal2, principal3 } = calculate(this.props.principal); return ( <Card> <Input placeholder="Placeholder" label="Label" onChangeText={this.onPrincipalChange.bind(this)} value={this.props.principal} /> Текущее состояние переменной: ${this.props.principal}{/n} Новая переменная: ${principal2} Новая переменная: ${principal3} </Card> ); } } const mapStateToProps = state => { return { principal: state.form.principal }; }; export default connect(mapStateToProps, { principalChanged })(App); 
     calculate.js 
     export const calculate = (principal) => { const result = {}; result.principal2 = principal * 2; result.principal3 = result.principal2 / 4; return result; };