Реагируйте встроенную функцию в рендере с MOBX

Question

Можно ли использовать функцию bind при рендеринге с помощью mobx?Я знаю, что эта практика приводит к снижению производительности, но мой коллега говорит, что если мы используем mobx, мы можем сделать bind функцию при рендеринге

Пример:

import { inject, observer } from 'mobx-react'

@inject('store')
@observer
export default class Component extends React.Component {
  render() {
    const {
      store: {
        pushByPath,
      },
    } = this.props
    return (
      <div>
        <button
          onClick={() => pushByPath('param1')}
        />
        <button
          onClick={() => pushByPath('param2')}
        />
        <button
          onClick={() => pushByPath('param3')}
        />
      </div>
    )
  }
}

Answer 1

если вам нужно, чтобы ваша функция pushByPath была привязана к экземпляру магазина, вы можете использовать такой шаблон:

import {action} from 'mobx';

class Store {

   @action.bound pushByPath(path) {
       // this here will always point to an instance of Store
   }
}

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