【ICE】飞冰项目中根据不同域名设置不同的网站logo

官网介绍

• 你可以在 src/app.tsx 中使用 defineMiniappConfig 导出 miniappLifecycles 来进行原生应用的生命周期事件注册：

import { defineMiniappConfig } from '@ice/plugin-miniapp/runtime';

export const miniappLifecycles = defineMiniappConfig(() => {
  return {
    onLaunch(options) {
      console.log('on launch', options);
    },
    onShow(options) {
      console.log('on show', options);
    }
  };
});

代码实现

• 在onLaunch事件中可以动态设置网站logo

import logo from '@/assets/logo.png';
import NiceModal from '@ebay/nice-modal-react';
import { ConfigProvider, Skeleton } from 'antd';
import zhCN from 'antd/lib/locale/zh_CN';
import dayjs from 'dayjs';
import 'dayjs/locale/zh-cn';
import relativeTime from 'dayjs/plugin/relativeTime';
import { IAppConfig, config, runApp } from 'ice';
import { NoAuth } from './components/NoAuth';
import './override-antd.less';
import NotFoundPage from './pages/NotFound';
import { createInterceptor } from './services/errorhandler';

/** 配置 dayjs */
dayjs.locale('zh-cn');
dayjs.extend(relativeTime);

/** 配置 icejs */
console.log('运行时 config', config);
const appConfig: IAppConfig = {
  app: {
    rootId: 'app-container',
    addProvider({ children }) {
      return (
        <ConfigProvider locale={zhCN}>
          <NiceModal.Provider>{children}</NiceModal.Provider>
        </ConfigProvider>
      );
    },
    onLaunch(options) {
      function setFavicon(href) {
        var link: any = document.querySelector("link[rel~='icon']");
        link.href = href;
      }
      // 根据不同的域名设置不同的favicon
      if (window.location.hostname.startsWith('liuxing')) {
        setFavicon(logo);
      }
    },
  },
  auth: {
    NoAuthFallback: <NoAuth />,
  },
  request: [
    {
      withCredentials: true,
      baseURL: `${config.baseURL}/api`,
      headers: {
        'X-Requested-With': 'XMLHttpRequest',
      },
      interceptors: createInterceptor(),
    },
  ],
  router: {
    type: 'hash',
    modifyRoutes: (routes) => {
      const addNotFoundRoute = (routes) => {
        if (Array.isArray(routes)) {
          routes.push({
            path: '*',
            component: NotFoundPage,
          });
        }
        for (const r of routes) {
          if (Array.isArray(r.children)) {
            addNotFoundRoute(r.children);
          }
        }
      };
      addNotFoundRoute(routes);

      return routes;
    },
    fallback: (
      <div>
        <Skeleton active paragraph={{ rows: 50 }} title />
      </div>
    ),
  },
};

runApp(appConfig);