Zp-ui NPM | npm.io

UI工具

主要目录结构

constants，常量
src
- carousel
- group，通用类
- imageLoader
- modal
- swipe
- swipeCarousel
styles
- _func.scss
- _root.scss

其中_func.scss中$rem默认100px，可设置覆盖

Observer

使用观察者模式管理状态切换

自定义观察者(observer)必须包含update方法，接收目标(subject)的当前状态和原状态。使用目标实例方法attach(), detach()管理观察者，参数接收(Observer|Array.<Observer>)。

const customObserver = () => ({
  update(state, prevState) {
    const { page: currentPage } = state;
    const { page: prevPage } = prevState;

    if (prevPage !== currentPage && currentPage === 'main') {
      doSth();
    }
  },
});

const menu = new Menu('main');
menu.attach(customObserver());

menu添加自定义观察者示例。当menu状态切换到打开main页时将执行doSth函数。