我想在不使用装饰器的情况下使用 mobx。通常我使用 mobx 包中的 decorate
但在这种特殊情况下,我找不到让它工作的方法。
原始代码:
import { observable } from 'mobx'
import { create, persist } from 'mobx-persist'
class Order {
@persist('object')
@observable
currentOrder = null
}
我试过的:
import { observable, decorate } from 'mobx'
import { create, persist } from 'mobx-persist'
import { compose } from 'recompose'
class Order {
currentOrder = null
}
decorate(Order, {
currentOrder: compose(persist('object'), observable),
})
错误来自 persist
告诉 serializr 装饰器没有正确使用。
知道为什么这与上面不同并且不起作用吗?
最佳答案
长话短说
属性装饰器需要非常具体的组合实现。
完整答案
属性装饰器基本上是以下形式的函数:
(target, prop, descriptor) => 修改后的描述符
因此,为了组合两个属性装饰器,您需要将第一个装饰器的结果作为第三个参数传递给第二个装饰器(连同目标
和 prop
)。
Recompose.compose
(与 lodash.flowRight
相同)从右到左应用函数并将结果作为单个参数传递给下一个函数。
因此,您不能使用 Recompose.compose
来组合装饰器,但您可以轻松地为装饰器创建一个组合器:
/* compose.js */
export default (...decorators) => (target, key, descriptor) =>
decorators.reduce(
(accDescriptor, decorator) => decorator(target, key, accDescriptor),
descriptor
);
然后我们使用它来组合 observable
和 persist("object")
。
/* Order.js */
import { observable, decorate, action } from "mobx";
import { persist } from "mobx-persist";
import compose from "./compose";
class Order {
currentOrder = null;
}
export default decorate(Order, {
currentOrder: compose(
observable,
persist("object")
)
});
[21/8/18] MobX >=4.3.2
& >=5.0.4
更新:
我为 MobX5 打开了 PR(已合并) & MobX4为了在 decorate
实用函数中支持多个装饰器 OOB。
所以,这在 MobX >=4.3.2
& >= 5.0.4
中可用:
import { decorate, observable } from 'mobx'
import { serializable, primitive } from 'serializr'
import persist from 'mobx-persist';
class Todo {
id = Math.random();
title = "";
finished = false;
}
decorate(Todo, {
title: [serializable(primitive), persist('object'), observable],
finished: observable
})
关于javascript - 如何在没有装饰器的情况下重写这个js类,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51259934/