zoukankan      html  css  js  c++  java
  • [MST] Create Dynamic Types and use Type Composition to Extract Common Functionality

    Since MST offers a runtime type system, it can create and compose types on the fly, making it possible to reuse logic in new and powerful ways.

    In this lesson you will learn:

    • That MST types are immutable and composed together behind the scenes
    • How to compose types explicitly by using types.compose
    • How to create dynamic, parameterized types by leveraging that MST types are first class javascript citizens
    import { types, flow, getSnapshot, onSnapshot } from "mobx-state-tree"
    
    export function createStorable(collection, attribute) {
        return types.model({}).actions(self => ({
            save: flow(function* save() {
                try {
                    yield window.fetch(`http://localhost:3001/${collection}/${self[attribute]}`, {
                        method: "PUT",
                        headers: { "Content-Type": "application/json" },
                        body: JSON.stringify(getSnapshot(self))
                    })
                } catch (e) {
                    console.error("Uh oh, failed to save: ", e)
                }
            }),
            afterCreate() {
                onSnapshot(self, self.save)
            }
        }))
    }
    import { types, flow, getParent, applySnapshot, getSnapshot, onSnapshot } from "mobx-state-tree"
    
    import { WishList } from "./WishList"
    import { createStorable } from "./Storable"
    
    const User = types.compose(
        types
            .model({
                id: types.identifier(),
                name: types.string,
                gender: types.enumeration("gender", ["m", "f"]),
                wishList: types.optional(WishList, {}),
                recipient: types.maybe(types.reference(types.late(() => User)))
            })
            .actions(self => ({
                getSuggestions: flow(function* getSuggestions() {
                    const response = yield window.fetch(
                        `http://localhost:3001/suggestions_${self.gender}`
                    )
                    self.wishList.items.push(...(yield response.json()))
                })
            })),
        createStorable("users", "id")
    )
  • 相关阅读:
    Java多线程之“同步”
    50 道 Java 线程面试题(转载自牛客网)
    Ubuntu14.04搭建Caffe(仅CPU)
    【译】OkHttp3 拦截器(Interceptor)
    OkHttp3 使用详解
    JSP ---- 声明、表达式、脚本、注释
    dom解析和sax解析的区别及优缺点
    一个java源文件中为什么只能有一个public类。
    js传入参数为字符串问题
    java project中 xml文件路径问题
  • 原文地址:https://www.cnblogs.com/Answer1215/p/8396711.html
Copyright © 2011-2022 走看看