Отделение logi c и функции render () от компонента - PullRequest
0 голосов
/ 09 мая 2020

Я хотел бы иметь компонент, функция рендеринга которого находится в другом файле, чтобы иметь разделение между лог c моего компонента и рендерингом.

Наивно, я попытался сделать только один файл, содержащий мой компонент и отображающий функциональный компонент с тем же именем, которому я передал необходимые реквизиты, чтобы все отображалось правильно.

Что-то вроде этого:

// MyComponent.render.jsx
export default MyComponentRender = (props) => {
    return {
        <View>
            // render all components of my view
        </View>
    }
}


// MyComponent.js
class MyComponent extends Component {
    // some logic

    render() {
        return (
            <MyComponentRender
                aLotOfProps=....
            />
        )
    }
}

Но вскоре я обнаружил, что иногда мне приходится отправлять довольно большое количество props и +, у меня есть, например, textInputs, которые должны быть focus () или blur () в ответ на некоторые logi c, на мой взгляд, но как В результате я не мог контролировать это, просто отправляя реквизиты. Это быстро превратилось в беспорядок!

Мне было интересно, есть ли простой способ разделить logi c компонента и его функции рендеринга? Может быть, есть способ передать контекст моего компонента моей функции / компоненту рендеринга, чтобы он имел прямой доступ ко всем состояниям и мог также хранить ссылки, et c.?

Спасибо,

Виктор

...