React18版本需要提示更新

[ZYyyh-cool]

import { Map,Marker} from '@uiw/react-amap'; 使用Map就会提示 Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more 希望能更新下React18版本 使用情况：

function App() {
  return (
    <Suspense fallback={<Spinner />}>
      <APILoader akay="">
            <Map 
             viewMode='3D'
             zoom='11.8'
             center={[10.126,30.236]}
             mapStyle= "amap://styles/darkblue"
             >
            </Map>
      </APILoader>
    </Suspense>
  );
}

const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
      <Provider store={store}>
        <App />
     </Provider>
);

[jaywcjlove]

@ZYyyh-cool https://codesandbox.io/embed/react-amap-example-y0n6c-forked-jbeyw4?fontsize=14&hidenavigation=1&theme=dark

我这边测试没有问题，参考上面示例

[jaywcjlove]

// Before
import { render } from 'react-dom';
const container = document.getElementById('app');
render(<App tab="home" />, container);

// After
import { createRoot } from 'react-dom/client';
const container = document.getElementById('app');
const root = createRoot(container); // createRoot(container!) if you use TypeScript
root.render(<App tab="home" />);

@ZYyyh-cool 错误在于你 18 的 API使用

[jaywcjlove]

https://reactjs.org/blog/2022/03/08/react-18-upgrade-guide.html#updates-to-client-rendering-apis

[ZYyyh-cool]

@jaywcjlove 18 API使用没用问题，可以看看上面使用情况代码，注释掉Map组件没有报错，我再排查下

[ZYyyh-cool]

我也测试了你的实例，也是没有问题

[jaywcjlove]

@ZYyyh-cool createRoot 倒入官方指定下面方式。ReactDOM.createRoot 是错误的吧

import { createRoot } from 'react-dom/client';

[ZYyyh-cool]

尝试在Map组件里面添加Marker会报错，不确实是否能这样用，我看你们的官网网站是这样用的

[ZYyyh-cool]

我换这种用法就没有报错了

[HerbertHe]

我也是添加Marker有报错

[HerbertHe]

还有之前提到的类型不兼容的问题: #233

[jaywcjlove]

• https://github.com/facebook/react/issues/24292#issuecomment-1091690844

[jaywcjlove]

React 17 示例: https://codesandbox.io/embed/react-amap-example-react-17-y0n6c?fontsize=14&hidenavigation=1&theme=dark React 18 示例: https://codesandbox.io/embed/react-amap-example-react-18-2ulj5v?fontsize=14&hidenavigation=1&theme=dark

@ZYyyh-cool @HerbertHe 我已经解决问题，同时支持 react 17/18