在Ionic Capacitor React中隐藏启动画面

Question

我们如何在Ionic应用程序中禁用闪屏？我正在使用Ionic 4、Capacitor和React。我尝试在capacitor.config.json文件中添加以下内容：

{
  "plugins": {
    "SplashScreen": {
      "launchShowDuration": 0
    }
  }
}

上述代码根本无法正常工作。

- Andrew

---

你找到了吗？ - Mina Ragaie

Answer 1

你可以使用 SplashScreen 插件隐藏启动画面：

import { Plugins } from '@capacitor/core';
const { SplashScreen } = Plugins;

function useSplashHide(){
    useEffect(() => {
        SplashScreen.hide();
    }, []);
} 

您可以像使用任何钩子一样使用它：

function MyComponent(props){
  useSplashHide()

  return <>....</>
}

文档在这里

- Stephane L

---

@LengLong，你是怎么使用它的？我无法让它工作。 - kkakroo

@kkakroo 我已经编辑答案以向您展示如何使用它，这是一个普通的Hook，因此您可以像使用任何其他Hook一样使用它。 - Stephane L

我在Login.tsx（我的第一个加载的组件）和App.tsx中尝试了这个。还尝试将其作为组件调用。但那也不起作用。 - kkakroo

Answer 2

电容版本 v2

https://capacitorjs.com/docs/v2/apis/splash-screen

import { Plugins } from '@capacitor/core';
const { SplashScreen } = Plugins;

1.call hide()

// Hide the splash (you should do this on app launch)
SplashScreen.hide();<------------------------call hide function 

2.或将showduration设置为0

// Show the splash for two seconds and then auto hide:
SplashScreen.show({
  showDuration: 0,<------------------------set 0 duration to hide
  autoHide: true,
});

版本 v3

https://capacitorjs.com/docs/apis/splash-screen

- Balaji

Answer 3

您只需在config.xml中添加以下行：

<preference name="SplashScreenDelay" value="0"/>

- Pushprajsinh Chudasama

---

对不起，我知道如果你使用Cordova它可以工作，但是我目前正在使用没有config.xml的Capacitor。 - Andrew