web-infra-dev / modern.js

Modern.js is a web engineering system, including a web framework and a npm package solution.
https://modernjs.dev/en/
MIT License
4.28k stars 352 forks source link

[Feature]: runtime config 增加 reduck 配置传输 #5541

Open undermoodzyx opened 4 months ago

undermoodzyx commented 4 months ago

这个功能解决了什么问题?

在约定式路由场景下,可以配置 reduck 的 middlewares

你期望的 API 是什么样子的?

其实更需要的是一个 api ,在约定式路由场景下,用户自行控制 App elem

// index.tsx
import Provider from 'project-specific'
import { AppReactElem } from '@modern-js/runtime'

export function render() {
  return (<Provider><AppReactElem /></Provider/>)
}
guangzan commented 3 months ago

约定式路由场景下,请问目前有什么解决方案吗,比如使用 NiceModal 需要添加根组件的 Provider:

import NiceModal from '@ebay/nice-modal-react';

ReactDOM.render(
  <React.StrictMode>
    <NiceModal.Provider>
      <App />
    </NiceModal.Provider>
  </React.StrictMode>,
  document.getElementById('root'),
);

类似的,使用 react router v6 的 <ScrollRestoration /> 时,需要添加到根路由中:

+ import { ScrollRestoration } from "react-router-dom";

function RootRouteComponent() {
  return (
    <div>
      {/* ... */}
+     <ScrollRestoration />
    </div>
  );
}