Question

我可以在mobx渲染中使用bind函数吗？我知道这种做法会导致性能下降，但是我的同事说，如果我们使用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都没关系。

使用Mobx在渲染中反应内联函数

1 个答案: