ice icon indicating copy to clipboard operation
ice copied to clipboard

@ice/appear的VisibilityChange元素引入报错

Open diudiudiu opened this issue 1 year ago • 0 comments

Describe the bug

代码引入

import VisibilityChange from '@ice/appear';

export default function Home() {
  return (
    <VisibilityChange
      onDisappear={() => {
        console.log('onDisappear');
      }}
    >
      show something
    </VisibilityChange>
  );
}

报错信息: react.development.js:1229 Uncaught Error: React.Children.only expected to receive a single React element child. at Object.onlyChild [as only] (react.development.js:1229) at VisibilityChange (index.js:28) at renderWithHooks (react-dom.development.js:16305) at mountIndeterminateComponent (react-dom.development.js:20074) at beginWork (react-dom.development.js:21587) at HTMLUnknownElement.callCallback (react-dom.development.js:4164) at Object.invokeGuardedCallbackDev (react-dom.development.js:4213) at invokeGuardedCallback (react-dom.development.js:4277) at beginWork$1 (react-dom.development.js:27451) at performUnitOfWork (react-dom.development.js:26557) react-dom.development.js:18687 The above error occurred in the <VisibilityChange> component:

at VisibilityChange (http://localhost:3000/js/vendors-node_modules___ice_appear_0_1_5_ice_appear_esm_index_js.js:19:13)
at Home
at RouteComponent (http://localhost:3000/js/vendors-node_modules___ice_bundles_0_1_8_ice_bundles_compiled_pmmmwh_react-refresh-webpack-pl-05700e.js:8384:27)
at SpmLogicHOC (http://localhost:3000/js/vendors-node_modules___ice_bundles_0_1_8_ice_bundles_compiled_pmmmwh_react-refresh-webpack-pl-05700e.js:7015:28)
at RouteWrapper (http://localhost:3000/js/vendors-node_modules___ice_bundles_0_1_8_ice_bundles_compiled_pmmmwh_react-refresh-webpack-pl-05700e.js:7618:13)
at RenderedRoute (http://localhost:3000/js/framework.js:6093:5)
at Routes (http://localhost:3000/js/vendors-node_modules___ice_bundles_0_1_8_ice_bundles_compiled_pmmmwh_react-refresh-webpack-pl-05700e.js:7333:19)
at Router (http://localhost:3000/js/framework.js:6548:15)
at AppRouter (http://localhost:3000/js/vendors-node_modules___ice_bundles_0_1_8_ice_bundles_compiled_pmmmwh_react-refresh-webpack-pl-05700e.js:7328:13)
at App (http://localhost:3000/js/vendors-node_modules___ice_bundles_0_1_8_ice_bundles_compiled_pmmmwh_react-refresh-webpack-pl-05700e.js:7184:13)
at BrowserEntry (http://localhost:3000/js/vendors-node_modules___ice_bundles_0_1_8_ice_bundles_compiled_pmmmwh_react-refresh-webpack-pl-05700e.js:8704:25)

Consider adding an error boundary to your tree to customize error handling behavior. Visit https://reactjs.org/link/error-boundaries to learn more about error boundaries. logCapturedError @ react-dom.development.js:18687 react-dom.development.js:26923 Uncaught Error: React.Children.only expected to receive a single React element child. at Object.onlyChild [as only] (react.development.js:1229) at VisibilityChange (index.js:28) at renderWithHooks (react-dom.development.js:16305) at mountIndeterminateComponent (react-dom.development.js:20074) at beginWork (react-dom.development.js:21587) at beginWork$1 (react-dom.development.js:27426) at performUnitOfWork (react-dom.development.js:26557) at workLoopSync (react-dom.development.js:26466) at renderRootSync (react-dom.development.js:26434) at recoverFromConcurrentError (react-dom.development.js:25850)

Expected behavior

能够正常支持appear事件,并且不阻塞渲染

Actual behavior

No response

Version of ice.js

3.1.6

Content of build.json or ice.config.mts

import { defineConfig } from '@ice/app';
import def from '@ali/ice-plugin-def';
import pha from '@ice/plugin-pha';
import spm from '@ali/ice-plugin-spm';
import compatRax from '@ice/plugin-rax-compat';

// The project config, see https://ice3.alibaba-inc.com/v3/docs/guide/basic/config
const minify = process.env.NODE_ENV === 'production' ? 'swc' : false;
export default defineConfig(() => ({
  // Set your configs here.
  minify,
  server: {
    onDemand: true,
    format: 'esm',
  },
  routes: {
    defineRoutes: (route) => {
      route('/home.html', 'Home/index.tsx');
      route('/test.html', 'Test/index.tsx');
    }
  },
  ssg: false,
  ssr: false,
  plugins: [
    def(),
    pha({
      template: true,
      preload: true,
    }),
    spm(),
    compatRax()
  ],
}));

Additional context

No response

diudiudiu avatar Apr 27 '23 04:04 diudiudiu