TypeScript types.array方法代码示例

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"]])
})

test("can time travel with Mutable object", t => {
    const MutableUnion = types.union(
        types.string,
        types.boolean,
        types.number,
        types.map(types.late(() => MutableUnion)),
        types.array(types.late(() => MutableUnion))
    )
    const MutableStoreModel = types
        .model({
            mutable: MutableUnion
        })
        .actions(self => {
            setUndoManagerDifferentTree(self)
            return {
                setProp(k, v) {
                    self.mutable.set(k, v)
                }
            }
        })
    const store = MutableStoreModel.create({ mutable: {} })
    const mutable = store.mutable

    t.deepEqual(mutable.toJSON(), {})
    t.is(undoManager.canUndo, false)
    t.is(undoManager.canRedo, false)
    t.is(undoManager.history.length, 0)

    store.setProp("foo", 1)
    t.deepEqual(mutable.toJSON(), { foo: 1 })
    t.is(undoManager.canUndo, true)
    t.is(undoManager.canRedo, false)
    t.is(undoManager.history.length, 1)

    store.setProp("foo", {})
    t.deepEqual(mutable.toJSON(), { foo: {} })
    t.is(undoManager.canUndo, true)
    t.is(undoManager.canRedo, false)
    t.is(undoManager.history.length, 2)

    undoManager.undo()
    t.deepEqual(mutable.toJSON(), { foo: 1 })
    t.is(undoManager.canUndo, true)
    t.is(undoManager.canRedo, true)
    t.is(undoManager.history.length, 2)

    undoManager.undo()
    t.deepEqual(mutable.toJSON(), {})
    t.is(undoManager.canUndo, false)
    t.is(undoManager.canRedo, true)
    t.is(undoManager.history.length, 2)
})

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"
    ])
})

export function mstWithChildren<PROPS extends ModelProperties, OTHERS, TYPE>(
	Code: new() => TYPE,
	Data: IModelType<PROPS, OTHERS>,
	name?: string
) {
	const Children = types.array(types.late((): any => Model)) as IArrayType<
		RecursiveCreationType<PROPS>,
		RecursiveSnapshotType<PROPS>,
		TYPE
	>;
	const Branch = (Data as any as IModelType<PROPS, TYPE>).props({
		children: types.maybe(
			Children as any as IComplexType<
				RecursiveCreationType<PROPS>[],
				RecursiveSnapshotType<PROPS>[],
				IObservableArray<IModelType<PROPS, OTHERS>>
			>
		)
	});

	const Model = mst(Code, Branch, 'Node') as typeof Branch;

	return({ Model, Children });
}

import { types } from 'mobx-state-tree';

export const NavItem = types.model('NavItem', {
  id: types.identifier(types.string),
  text: types.string,
  url: types.optional(types.string, ''),
  subTitle: types.optional(types.string, ''),
  icon: types.optional(types.string, ''),
  img: types.optional(types.string, ''),
  active: types.optional(types.boolean, false),
  hideFromTabs: types.optional(types.boolean, false),
  breadcrumbs: types.optional(types.array(types.late(() => Breadcrumb)), []),
  children: types.optional(types.array(types.late(() => NavItem)), []),
});

export const Breadcrumb = types.model('Breadcrumb', {
  title: types.string,
  url: types.string,
});

    IModelType,
    ISnapshottable,
    IMiddlewareEvent,
    IPatchRecorder,
    IJsonPatch
} from "mobx-state-tree"
import { IObservableArray } from "mobx"

const Entry = types.model("UndoManagerEntry", {
    patches: types.frozen,
    inversePatches: types.frozen
})

const UndoManager = types
    .model("UndoManager", {
        history: types.optional(types.array(Entry), []),
        undoIdx: 0
    })
    .views(self => ({
        get canUndo() {
            return self.undoIdx > 0
        },
        get canRedo() {
            return self.undoIdx < self.history.length
        }
    }))
    .actions(self => {
        let skipping = false
        let flagSkipping = false
        let targetStore: IStateTreeNode
        let replaying = false

  tmdbId: types.maybeNull(types.number),
  budget: types.maybeNull(types.number),
  revenue: types.maybeNull(types.number),
  homepage: types.maybeNull(types.string),
  originalLanguage: types.maybeNull(types.string),
  originalTitle: types.maybeNull(types.string),
  status: types.maybeNull(MovieStatus),
  tagline: types.maybeNull(types.string),
  tmdbPopularity: types.maybeNull(types.number),
  imdbRating: types.maybeNull(types.number),
  imdbVotes: types.maybeNull(types.number),
  tmdbRating: types.maybeNull(types.number),
  tmdbVotes: types.maybeNull(types.number),
  metacriticVotes: types.maybeNull(types.number),
  metacriticRating: types.maybeNull(types.number),
  genres: types.optional(types.array(GenreReference), []),
  showtimes: types.maybeNull(types.array(Showtime)),
  contentRating: types.maybeNull(types.string),
  trailerUrl: types.maybeNull(types.string),
  keywords: types.optional(types.array(types.string), []),
  credits: types.optional(types.array(Credit), []),
  locales: types.optional(types.array(MovieLocale), []),
  languages: types.optional(types.array(Language), []),
})
.actions(self => ({
  update(obj: any, isPartial: boolean) {
    const isFull = !self.isPartial;
    const movie = mapMovie(obj, isPartial);

    // Merge showtimes
    // TODO: Cached movie loaded will have undefined showtimes for the first page!!

import { types } from 'mobx-state-tree';
import { Locale } from './Locale';

export const GenreLocale = types.model('GenreLocale', {
  id: types.identifier,
  locale: types.maybe(Locale),
  name: types.maybe(types.string),
});

export const Genre = types.model('Genre', {
  id: types.identifier,
  externalId: types.maybe(types.number),
  name: types.maybe(types.string),
  locales: types.maybe(types.array(GenreLocale)),
});

import {
    types,
    onSnapshot,
    applySnapshot,
    getSnapshot,
    getEnv,
    resolvePath,
    getPath,
    ISnapshottable,
    IModelType
} from "mobx-state-tree"
import { IObservableArray } from "mobx"

const TimeTraveller = types
    .model("TimeTraveller", {
        history: types.optional(types.array(types.frozen), []),
        undoIdx: -1,
        targetPath: ""
    })
    .views(self => ({
        get canUndo() {
            return self.undoIdx > 0
        },
        get canRedo() {
            return self.undoIdx < self.history.length - 1
        }
    }))
    .actions(self => {
        let targetStore: any
        let snapshotDisposer: any
        let skipNextUndoState = false

import { types, flow } from 'mobx-state-tree';
import { Movie } from './models/Movie';
import { client } from '../services/graphql.service';
import fetchMovieByIdQuery from '../queries/fetchMovieById.gql';
import fetchNewMoviesQuery from '../queries/fetchNewMovies.gql';
import { addDays } from 'date-fns';
import { mapMovie } from 'utils/mapMovie';
import { FetchPolicy } from 'apollo-boost';

export const Movies = types.model('Movies', {
  movies: types.map(Movie),
  comingSoon: types.array(types.reference(Movie)),
  isOffline: false,
  isCache: false,
})
.actions(self => ({
  addPartialMovie: (obj: any) => {
    return (self as any).addMovie(obj, true);
  },
  addMovie: (obj: any, isPartial: boolean) => {
    if (self.movies.has(obj.id)) {
      const movie = self.movies.get(obj.id);
      return movie!.update(obj, isPartial);
    }

    return self.movies.put(
      Movie.create(mapMovie(obj, isPartial)),
    );
  },
  loadMovieById: flow(function* loadMovieById(movieId: string) {
    const start = new Date();