| 1 | /**
|
| 2 | *`expr` can be used to create temporary computed values inside computed values.
|
| 3 | * Nesting computed values is useful to create cheap computations in order to prevent expensive computations from needing to run.
|
| 4 | * In the following example the expression prevents that a component is rerender _each time_ the selection changes;
|
| 5 | * instead it will only rerenders when the current todo is (de)selected.
|
| 6 | *
|
| 7 | * `expr(func)` is an alias for `computed(func).get()`.
|
| 8 | * Please note that the function given to `expr` is evaluated _twice_ in the scenario that the overall expression value changes.
|
| 9 | * It is evaluated the first time when any observables it depends on change.
|
| 10 | * It is evaluated a second time when a change in its value triggers the outer computed or reaction to evaluate, which recreates and reevaluates the expression.
|
| 11 | *
|
| 12 | * In the following example, the expression prevents the `TodoView` component from being re-rendered if the selection changes elsewhere.
|
| 13 | * Instead, the component will only re-render when the relevant todo is (de)selected, which happens much less frequently.
|
| 14 | *
|
| 15 | * @example
|
| 16 | * const TodoView = observer(({ todo, editorState }) => {
|
| 17 | * const isSelected = mobxUtils.expr(() => editorState.selection === todo)
|
| 18 | * return <div className={isSelected ? "todo todo-selected" : "todo"}>{todo.title}</div>
|
| 19 | * })
|
| 20 | */
|
| 21 | export declare function expr<T>(expr: () => T): T;
|