Machine/core 代码

疑问：machine核心代码应该不用我去更改任何的东西吧！

useMachine.ts

  • 位置： machine/core/useMachine.ts

  • DSL核心处理代码，开发时应该不需要管

    Render.vue

  • 位置： machine/core/Render.vue

  • 接受machine作为props，渲染所有的block

    renderBlock

  • 位置： machine/core/RenderBlock.vue

  • 获取到machine中data，动态渲染成对应的图层，并且传入data

    BaseModel

  • 位置： machine/core/BaseModel.ts

  • 作用：用于提供模型机的一些通用数据和方法，比如 settter和 getter
  • 模型机的基类，将来所有的模型机都需要继承 BaseModel

  • 核心代码 ```typescript // 数据模型基类，目前貌似没有用到，作用：给图层提供数据 class BaseModel { data: { [key: string]: any } = {};

    get(key: string) { return this.data[key]; }

    set(key: string, value: any) { this.data[key] = value; } }

export default BaseModel;

  2. <a name="TqMo7"></a>
  3. # Machine/layer
  5. - 位置：`layer/xxxx.vue`
  6. - 作用：提供各种各样的图层，可以对一个页面（frame）进行拆解，拆解成N多个图层。比如 loading图层， HelloWorld图层， banner图层， Tab图层等等
  7. - 问题1: 目前这些图层需要自己开发， 将来这些图层应该由拖拖拽拽的可视化物料来生成？
  8. - 问题2：状态如何影响图层的输出？？目前这些图层的数据都是写死的。 是不是可以通过props来接受模型机中的属性和方法？？
  9. <a name="Wi7EZ"></a>
  10. # Model层
  12. - 位置`hooks/xxxModel`
  13. - 作用：模型机，给图层提供数据和方法，将来可以有很多的模型机。
  14. <a name="NiN52"></a>
  15. ## UserModel
  17. - 位置：`hooks/UserModel.ts`
  18. - 核心代码
  19.    - `data`用于提供模型机的数据
  20.    - `methods`用于提供模型机的方法
  21. ```javascript
  22. import BaseModel from "@/machine/core/BaseMode";
  24. interface IUserModel {
  25.   login: () => void;
  26.   logout: () => void;
  27. }
  29. class UserModel extends BaseModel implements IUserModel {
  30.   // 模型机的数据
  31.   data = {
  32.     userStatus: "",
  33.   };
  34.   // 模型机的方法
  35.   login() {
  36.     console.log("login");
  37.   }
  38.   // 模型机的方法
  39.   logout() {
  40.     console.log("logout");
  41.   }
  42. }
  44. export default UserModel;

问题1：目前的demo中，模型机貌似没有用到
问题2: 将来二方接入服务，是通过模型机接入，我的理解是，应该在模型机中调用接口服务
问题3: 在模型机中调用了接口服务之后，会涉及到修改数据，更新组件等。

Demo组件

基础流程

  • 位置： machine/Demo.vue
  • 核心流程：
      1. 初始化Machine new Machine(config)
      1. 定义config，需要提供该页面核心的配置
        • models： 模型机
        • states: 状态
        • actions: 行为
        • layers: 图层
        • frames： 片段，
        • init：初始化逻辑
      1. Render渲染，传入Machineconfig

关于config的疑问

  • 问题1: frames和图层的关系？
    • 一个页面组件可以有多个frames，每个frames下可以有多个图层。
    • 但是所有图层的数据集中在同一个组件的state和actions中
  • 问题2: models模型机 state状态 actions的关系？
    • state中有hook可以修改状态
    • 模型机中可以 new model, model中也有状态和methods
    • actions中也有hooks
    • layers有data参数，data中有message和methods
    • 这样很乱，到处都是data和methods，这样开发难度有点大，边界不是很清晰。