本文整理汇总了TypeScript中mobx-state-tree.types.model方法的典型用法代码示例。如果您正苦于以下问题:TypeScript types.model方法的具体用法?TypeScript types.model怎么用?TypeScript types.model使用的例子?那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类mobx-state-tree.types
的用法示例。
在下文中一共展示了types.model方法的4个代码示例,这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞,您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: test
test("it logs", t => {
const Todo = mst.types
.model({
title: ""
})
.actions(self => ({
helper() {},
setTitle(newTitle) {
;(self as any).helper() // should not be logged
self.title = newTitle
}
}))
const Store = mst.types.model({
todos: mst.types.array(Todo)
})
const store = Store.create({
todos: [{ title: "test " }]
})
mst.addMiddleware(store, simpleActionLogger)
store.todos[0].setTitle("hello world")
t.deepEqual((console.log as any).args, [["[MST] /todos/0/setTitle"]])
})
示例2: test
test("on tree - group", t => {
const HistoryOnTreeStoreModel = types
.model({
x: 1,
history: types.optional(UndoManager, {})
})
.actions(self => {
setUndoManagerSameTree(self)
return {
inc() {
self.x += 1
}
}
})
const store = HistoryOnTreeStoreModel.create()
t.is(undoManager.canUndo, false)
t.is(undoManager.canRedo, false)
t.is(store.x, 1)
undoManager.startGroup(() => {
store.inc()
store.inc()
store.inc()
store.inc()
})
undoManager.stopGroup()
t.is(store.x, 5)
t.is(undoManager.canUndo, true)
undoManager.undo()
t.is(undoManager.canUndo, false)
t.is(undoManager.canRedo, true)
t.is(store.x, 2)
})
示例3: test
test("it logs flows", async t => {
const Todo = mst.types
.model({
title: ""
})
.actions(self => ({
helper() {},
helper2: flow(function* helper2() {
return Promise.resolve(3)
})
}))
.actions(self => ({
setTitle: flow(function* setTitle(newTitle) {
self.helper() // should not be logged
yield self.helper2() // should be logged
self.title = newTitle
return
})
}))
const Store = mst.types.model({
todos: mst.types.array(Todo)
})
const store = Store.create({
todos: [{ title: "test " }]
})
mst.addMiddleware(store, actionLogger)
await store.todos[0].setTitle("hello world")
t.deepEqual((console.log as any).args.map(([x]) => x), [
"[MST] #5 action - /todos/0/setTitle",
"[MST] #5 flow_spawn - /todos/0/setTitle",
"[MST] #5 flow_spawn - /todos/0/helper2",
"[MST] #5 flow_return - /todos/0/helper2",
"[MST] #5 flow_return - /todos/0/setTitle"
])
})
示例4: test
test("it can time travel same store and persist state", t => {
const W = types.model({
model: types.optional(TestModel, {}),
traveler: types.optional(TimeTraveller, { targetPath: "../model" })
})
const w = W.create()
const m = w.model
const tt = w.traveler
t.is(tt.canUndo, false)
t.is(tt.canRedo, false)
t.is(m.x, 1)
m.inc()
t.is(tt.canUndo, true)
t.is(tt.canRedo, false)
t.is(m.x, 2)
m.inc()
t.is(tt.canUndo, true)
t.is(tt.canRedo, false)
t.is(m.x, 3)
tt.undo()
t.is(m.x, 2)
t.is(tt.canUndo, true)
t.is(tt.canRedo, true)
// Clone of the store should inherit the same state!
const w2 = clone(w)
const m2 = w2.model
const tt2 = w2.traveler
tt2.undo()
t.is(m2.x, 1)
t.is(tt2.canUndo, false)
t.is(tt2.canRedo, true)
tt2.redo()
t.is(m2.x, 2)
t.is(tt2.canUndo, true)
t.is(tt2.canRedo, true)
// resets 'future'
m2.inc()
t.is(m2.x, 3)
t.is(tt2.canUndo, true)
t.is(tt2.canRedo, false)
})