## Is a guide similar to the Data ability development in the FA model available for the stage model?
## How do I obtain a notification when the device orientation changes?
Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
A guide is available for the **DataShareExtensionAbility** class, which provides APIs for sharing data with other applications and managing the data, in the stage model.
Use the **UIAbility.onConfigurationUpdate\(\)** callback to subscribe to system environment variable changes (including the language, color mode, and screen orientation).
## What should I do if the UI does not respond when an ability is started?
**Reference**
Applicable to: OpenHarmony SDK 3.2.5.3, stage model of API version 9
[Subscribing to System Environment Variable Changes](../application-models/subscribe-system-environment-variable-changes.md#using-uiability-for-subscription)
1. If the ability is started using **startAbility**, check whether the **abilityName** field in **want** uses the bundle name as the prefix. If yes, delete the bundle name.
## How do I redirect a user to a specified page after they touch a service widget?
2. Make sure the ability's home page file configured by **onWindowStageCreate** in the **MainAbility.ts** file is defined in the **main_pages.json** file.
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
3. You are advised to use the SDK and OpenHarmony SDK versions released on the same day.
Configure a widget event with the redirected-to UIAbility specified, and call **loadContent** in the **onWindowStageCreate\(\)** callback of the target UIAbility to redirect to the specified page.
## How do I set the UI of an ability to transparent?
**Reference**
Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
## Can I create a UIAbility and specify the process to run the UIAbility in the FA and Stage models?
.height('100%')
.backgroundColor('rgba(255,255,255, 0)')
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
}
```
**Solution**
Yes.
- FA model
The FA model supports multiple processes. By default, all components of an application run in the same process. This default scenario is suitable for most applications. To run a specific component in an independent process, configure the **process** tag under **ability** in the configuration file. Note that this tag is available only for system applications.
- Stage model
The stage model supports multiple processes. The process model is defined by the system, and third-party applications cannot be configured with multiple processes. To customize an independent process, you must request special permissions, and then specify the **process** tag under **module** in the configuration file. This tag specifies the process in which all the abilities in an HAP run. If this tag is not set, the bundle name is used as the process name by default.
## What are the differences between the stage model and the FA model in intra-process object sharing?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
**Solution**
- In the stage model, multiple application components share the same ArkTS engine instance. Therefore, they can easily share objects and state with each other. This also reduces the memory usage of complex applications.
- In the FA model, each application component exclusively uses an ArkTS engine instance. Therefore, you are advised to use the stage model when developing complex applications in distributed scenarios.
**Reference**
[Data Synchronization Between UIAbility and UI](../application-models/uiability-data-sync-with-ui.md)
## How do I use the lifecycle functions of AbilityStage?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
**Solution**
Add the field **"srcEntry": "./ets/myabilitystage/MyAbilityStage.ts"** under **module** in the **module.json5** file.
## How do I delete the mission snapshot in Recents after terminateself is called in the multiton scenario?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
**Solution**
You can set **removeMissionAfterTerminate** to **true** in the **module.json5** file.
## Why can't I start a UIAbility instance by using startAbility\(\)?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
**Solution**
- If the UIAbility is started using **startAbility**, check whether the **abilityName** field in **want** uses the bundle name as the prefix. If yes, delete the bundle name.
- Make sure the UIAbility's home page file configured by **onWindowStageCreate** in the **MainAbility.ts** file is defined in the **main\_pages.json** file. You are advised to use the SDK and OpenHarmony SDK versions released on the same day.
## How do I prevent "this" in a method from changing to "undefined" when the method is called?
## How do I prevent "this" in a method from changing to "undefined" when the method is called?
Applicable to: OpenHarmony SDK 3.2.5.3, stage model of API version 9
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
Method 1: Add **.bind(this)** when calling the method.
**Solution**
Method 1: Add **.bind\(this\)** when calling the method.
Method 2: Use the arrow function.
Method 2: Use the arrow function.
## What should I do when the message "must have required property 'startWindowIcon'" is displayed?
## What should I do when the error message "must have required property 'startWindowIcon'" is displayed during the UIAbility startup?
Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
Configure the **startWindowIcon** attribute under **abilities** in the **module.json5** file.
Configure the **startWindowIcon** attribute under **abilities** in the **module.json5** file.
Example:
**Example**
```
```
{
{
...
@@ -77,138 +133,226 @@ Example:
...
@@ -77,138 +133,226 @@ Example:
}
}
```
```
## How do I obtain a notification when the device orientation changes?
**Reference**
Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
Implement the **onConfigurationUpdated** callback in the **Ability** class. The callback is triggered when the system language, color mode, or display parameters (such as the orientation and density) change.
## Can I obtain the context through globalThis in the stage model?
## Can I obtain the context through globalThis in the stage model?
Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
Do not use **globalThis** to obtain the context in the stage model.
This is because all the processes of an application share a JS VM instance in the stage model. Multiple abilities can run on these processes and share the same global object. If **globalThis** is used, the context of different abilities of the same JS VM instance may be returned.
**Reference**
[Data Synchronization Between UIAbility and UI](../application-models/uiability-data-sync-with-ui.md)
## What should I do when an error indicating too large size is reported during HAP deployment?
Do not use **globalThis** to obtain the context in the stage model. This is because all the processes of an application share a JS VM instance in the stage model. Multiple abilities can run on these processes and share the same global object. If **globalThis** is used, the context of different abilities of the same JS VM instance may be returned.
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
Reference of the recommended operation: [Context (Stage Model)](../application-models/application-context-stage.md)
**Symptom**
## How do I obtain the HAP installation path of application B from application A?
During HAP deployment, the following error message is displayed:
Applicable to: OpenHarmony SDK 3.0 or later, stage model of API version 9
Failure\[INSTALL\_FAILED\_SIZE\_TOO\_LARGE\] error while deploying hap?
First, request the system permission. For details, see [Having Your App Automatically Signed](https://developer.harmonyos.com/en/docs/documentation/doc-guides/ohos-auto-configuring-signature-information-0000001271659465). Then, import the **bundle** module, and call **bundle.getApplicationInfo()** to obtain application information based on the bundle name. Finally, use **application.moduleSourceDirs** to obtain the application storage path.
**Solution**
You can split the HAP into multiple HAPs.
## How is data returned when startAbilityForResult is called?
## How is data returned when startAbilityForResult is called?
Applicable to: OpenHarmony SDK3.0, stage model of API version 9
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
The callee uses **AbilityContext.terminateSelfWithResult** to destroy its ability and pass parameters to **startAbilityForResult**. For details, see [AbilityContext](../reference/apis/js-apis-ability-context.md#abilitycontextterminateselfwithresult).
**Solution**
## Can the lifecycle callback of a released FA widget be triggered when the widget is displayed in the service center so that the user login information can be obtained without opening the FA application?
The target UIAbilities uses **AbilityContext.terminateSelfWithResult** to terminate itselef and pass the result to **startAbilityForResult**.
Applicable to: OpenHarmony SDK 3.2.5.5, FA model of API version 8
**Reference**
After a widget is added, the **oncreate()** lifecycle is triggered so that related user information (silent login) can be displayed even when the application is not started. However, users must manually add the widget after the application is installed.
[Starting UIAbility in the Same Application and Obtaining the Return Result](../application-models/uiability-intra-device-interaction.md)
## How do I obtain the context?
Applicable to: OpenHarmony SDK 3.2.7.5, stage model of API version 9
## How do I obtain the system timestamp?
You can use **this.context** to obtain the context in the **MainAbility.ts** file or call **getContext(this)** to obtain the context on the component page.
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
## What should I do when undefined is displayed for the calling of **abilityAccessCtrl.grantUserGrantedPermission** during API version 8 syntax verification?
**Solution**
Applicable to: OpenHarmony SDK 3.0, FA model of API version 8
Use **getCurrentTime** of **@ohos.systemDateTime** to obtain the system time and time zone.
**abilityAccessCtrl.grantUserGrantedPermission** is a system API. It is not available in the public SDK, which is provided as default on DevEco Studio. To use system APIs, switch to the full SDK. For details, see [Guide to Switching to Full SDK](../quick-start/full-sdk-switch-guide.md).
**Example**
## Which of the following Extension abilities are available in the public SDK: ServiceExtensionAbility, FormExtensionAbility, and DataShareExtensionAbility?
Use the **@ohos.systemDateTime** API as follows:
Applicable to: OpenHarmony SDK 3.2.5.6, stage model of API version 9
console.info(`Failed to get currentTime. message: ${error.message}, code: ${error.code}`);
return;
}
console.info(`Succeeded in getting currentTime : ${time}`);
});
} catch(e) {
console.info(`Failed to get currentTime. message: ${e.message}, code: ${e.code}`);
}
```
Among the aforementioned Extension abilities, only **FormExtensionAbility** is available in the public SDK. **ServiceExtensionAbility** and **DataShareExtensionAbility** are system APIs and available only in the full SDK.
Public SDK: intended for application developers and does not contain system APIs that require system permissions.
**Reference**
Full SDK: intended for original equipment manufacturers (OEMs) and contains system APIs that require system permissions.
[System time and time zone] (../reference/apis/js-apis-system-date-time.md#systemdatetimegetcurrenttime)
## Why can't I play GIF images cyclically on the widget?
## How do I obtain the cache directory of the current application?
Applicable to: OpenHarmony SDK 3.2.5.6, stage model of API version 9
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
The system does not support the display of GIF images on the widget.
**Solution**
## How do I implement service login by touching a widget?
Use **Context.cacheDir** to obtain the cache directory of the application.
Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
**Reference**
You can start an ability upon the touch and implement service login in the ability.
[Obtaining the Application Development Path](../application-models/application-context-stage.md#obtaining-the-application-development-path)
## How do I redirect to the application details page in Settings?
## In which JS file is the service widget lifecycle callback invoked?
Applicable to: OpenHarmony SDK 3.2.6.5
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
Refer to the following code:
**Solution**
```
When a widget is created, a **FormAblity.ts** file is generated, which contains the widget lifecycle.
## What should I do when the compilation on DevEco Studio fails while ServiceExtensionAbility and DataShareExtensionAbility APIs are used?
```
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
let listener = mediaquery.matchMediaSync('(orientation: landscape)')
onPortrait(mediaQueryResult) {
**Symptom**
if (mediaQueryResult.matches) {
// Do something here.
After the **ServiceExtensionAbility** and **DataShareExtensionAbility** APIs are used, DevEco Studio reports an error indicating that the compilation fails.
} else {
// Do something here.
**Cause**
}
}
The following types of SDKs are provided:
listener.on('change', onPortrait)
```
## How do I control the shadow background size during checkbox selection?
- Public SDK: intended for application developers and does not contain system APIs that require system permissions.
- Full SDK: intended for original equipment manufacturers (OEMs) and contains system APIs that require system permissions.
Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
The SDK downloaded using DevEco Studio is the public SDK.
Set the **padding** attribute of the **\<checkbox>** component to control the shadow size.
**Solution**
Third-party application cannot use **ServiceExtensionAbility** and **DataShareExtensionAbility**. To develop a system application, first [download the full SDK](../quick-start/full-sdk-switch-guide.md).
## How do I obtain the temp and files paths at the application level?
Applicable to: OpenHarmony 3.2 Beta5
**Solution**
Obtain them from the application context. Specifically, use **this.context.getApplicationContext.tempDir** i to obtain the **temp** path, and use **this.context.getApplicationContext.filesDir** to obtain the **files** path.
**Reference**
[Obtaining the Application Development Path](../application-models/application-context-stage.md#obtaining-the-application-development-path)
## Can the lifecycle callback of a released FA widget be triggered when the widget is displayed in the service center so that the user login information can be obtained without opening the FA application?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
**Solution**
After a widget is added, the **onCreate()** lifecycle is triggered so that related user information (silent login) can be displayed even when the application is not started. However, users must manually add the widget after the application is installed.
## How do I implement service login by touching a widget?
## How do I set the widget background to transparent?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
Applicable to: OpenHarmony SDK 3.2.5.5
**Solution**
1. Create the **widget/resources/styles/default.json** file in the root directory of the widget.
To create a service widget in the FA model, perform the following steps:
2. Add the following code to the **default.json** file:
1. Implement lifecycle callbacks for the widget.
2. Configure the widget configuration file.
3. Persistently store widget data.
4. Update widget data.
5. Develop the widget UI page.
6. Develop a widget event. You can start a UIAbility upon the touch and implement service login in the UIAbility.
**Reference**
[Widget Development in the FA Model](../application-models/widget-development-fa.md)
## How do I redirect to the application details page in Settings?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
## How do I get UIAbilityContext within the @Component component in the stage model?
Applicable to: OpenHarmony SDK 3.2.5.5
Applicable to: OpenHarmony 3.2 Beta5 (API version 9)
Use **featureAbility.getWant()** and **featureAbility.getContext()** to send data through **router** in the JSON file and use **featureAbility** to receive data in the JS file.
**Solution**
## How do I trigger router.disableAlertBeforeBackPage and router.enableAlertBeforeBackPage?
You can use **UIAbility.Context** to obtain the context.
Applicable to: OpenHarmony SDK 3.2.5.5
**Example**
The following conditions must be met:
```
import UIAbility from '@ohos.app.ability.UIAbility';
1. Before the redirection to the previous page, a confirm dialog box will be displayed. Note that **router.disableAlertBeforeBackPage** is used to disable the display of a confirm dialog box before returning to the previous page (default), and **router.enableAlertBeforeBackPage** is used to enable the display.
let UIAbilityContext = UIAbility.context;
let ApplicationContext = UIAbility.context.getApplicationContext();
## How do I determine whether an application is a system application?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
**Solution**
Use **bundleManager.getApplicationInfo** (available only for system applications) to obtain application information, and check the value of **systemApp** in the information. The application is a system application if the value is **true**.
## How do I obtain the version code and version name of an application?
Applicable to: OpenHarmony 3.2 Beta 5 (API version 9)
**Solution**
Use **bundleManager.getBundleInfoForSelf\(\)** to obtain the bundle information, which contains the version code (specified by **BundleInfo.versionCode**) and version name (specified by **BundleInfo.versionName**) .
**Example**
```
import bundleManager from '@ohos.bundle.bundleManager';
import hilog from '@ohos.hilog';
let bundleFlags = bundleManager.BundleFlag.GET_BUNDLE_INFO_DEFAULT;
[UIAbilityContext](../reference/apis/js-apis-inner-application-uiAbilityContext.md#uiabilitycontext) and [AbilityInfo](../reference/apis/js-apis-bundleManager-abilityInfo.md#abilityinfo)
## How do I obtain the application version number, version name, and screen resolution?
Applicable to: OpenHarmony 3.2 Beta5
**Solution**
1. Obtain the bundle information from the **@ohos.bundle.bundleManager** module.
The bundle information contains the application version number and version name.
```
import bundleManager from '@ohos.bundle.bundleManager';
## Can I obtain the HAP information of other applications from the current application?
Applicable to: OpenHarmony 3.2 Beta (API version 9)
According to the OpenHarmony security design specifications, the SDK does not provide APIs for third-party applications to obtain bundle information (including but not limited to the application name and version number) of other applications.
## How do I determine whether an application is a system application?
Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
Use **bundle.getApplicationInfo** to obtain the application information, and then check the value of **systemApp** in the information. The application is a system application if the value is **true**.
## Why do the isStatusBarLightIcon and isNavigationBarLightIcon attributes not take effect when window.setSystemBarProperties() is called?
## How do I obtain the DPI of a device?
Applicable to: OpenHarmony SDK 3.2.5.3, stage model of API version 9
Applicable to: OpenHarmony 3.2 Beta5 (API version 9, stage model)
In effect, the **isStatusBarLightIcon** and **isNavigationBarLightIcon** attributes turn the font white when set to **true**. If **statusBarContentColor** is also set in **window.setSystemBarProperties()**, the **isStatusBarLightIcon** attribute does not take effect. Similarly, if **navigationBarContentColor** is set, the **isNavigationBarLightIcon** attribute does not take effect.
**Solution**
## How do I set the style of the system bar?
Import the **@ohos.display** module and call the **getDefaultDisplaySync\(\)** API.
Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
**Example**
Import the **\@ohos.window** module, and call **window.setSystemBarProperties()**.
console.error('Failed to enable the full-screen mode. Cause:' + JSON.stringify(err));
console.error('Failed to enable the full-screen mode. Cause:' + JSON.stringify(err));
...
@@ -45,46 +56,37 @@ Applicable to: OpenHarmony SDK 3.2.6.3, stage model of API version 9
...
@@ -45,46 +56,37 @@ Applicable to: OpenHarmony SDK 3.2.6.3, stage model of API version 9
});
});
```
```
## How do I obtain the window width and height?
## How do I obtain the window width and height?
Applicable to: OpenHarmony SDK 3.2.3.5, stage model of API version 9
Applicable to: OpenHarmony SDK 3.2 Beta5 (API version 9, stage model)
Use **window.getProperties()** to obtain the window properties. The **windowRect** field in the properties specifies the window width and height.
**Solution**
Example:
Import the **@ohos.window** module, obtain a **Window** object, and use **getWindowProperties\(\)** of the object to obtain the window properties. The **windowRect** field in the properties specifies the window width and height.
**Example**
```ts
letpromise=windowClass.getProperties();
promise.then((data)=>{
console.info('Succeeded in obtaining the window properties. Data: '+JSON.stringify(data.windowRect));
}).catch((err)=>{
console.error('Failed to obtain the window properties. Cause: '+JSON.stringify(err));
});
```
```
import window from '@ohos.window';
## How do I set the color of the system bar?
let windowClass = null;
try {
Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
## How do I obtain the frame data of a camera when using the XComponent to display the preview output stream of the camera?
Applicable to: OpenHarmony 3.2 (API version 9, stage model)
**Symptom**
Currently, the API does not support real-time preview of the camera frame data. To obtain the frame data, you must bind an action, for example, photographing.
**Solution**
Create a dual-channel preview to obtain the frame data.
## How do I obtain the preview image of the front camera?
Applicable to: OpenHarmony 3.2 (API version 9, stage model)
**Solution**
1. Use the **@ohos.multimedia.camera** module to obtain the physical camera information.
```
let cameraManager = await camera.getCameraManager(context);
let camerasInfo = await cameraManager.getSupportedCameras();
let cameraDevice = this.camerasInfo[0];
```
2. Create and start the input stream channel of the physical camera.
```
let cameraInput = await cameraManager.createCameraInput(cameraDevice);
await this.cameraInput.open();
```
3. Obtain the output formats supported by the camera, and create a preview output channel based on the surface ID provided by the XComponent.
```
let outputCapability = await this.cameraManager.getSupportedOutputCapability(cameraDevice);
let previewProfile = this.outputCapability.previewProfiles[0];
let previewOutput = await cameraManager.createPreviewOutput(previewProfile, previewId);
```
4. Create a camera session, add the camera input stream and preview output stream to the session, and start the session. The preview image is displayed on the XComponent.
```
let captureSession = await cameraManager.createCaptureSession();
await captureSession.beginConfig();
await captureSession.addInput(cameraInput);
await captureSession.addOutput(previewOutput);
await this.captureSession.commitConfig()
await this.captureSession.start();
```
## How do I set the camera focal length?
Applicable to: OpenHarmony 3.2 (API version 9, stage model)
**Solution**
1. Check whether the camera is a front camera. A front camera does not support focal length setting.
2. Use **captureSession.getZoomRatioRange\(\)** to obtain the focal length range supported by the device.
3. Check whether the target focal length is within the range obtained. If yes, call **captureSession.setZoomRatio\(\)** to set the focal length.
## How do I play music in the background?
Applicable to: OpenHarmony 3.2 (API version 9, stage model)
**Symptom**
Music cannot be played in the background.
**Solution**
**AVSession** controls media playback. When a third-party application switches to the background or encounters a screen lock event, media playback is forcibly paused and the application is unaware of the pause. To enable the application to continue the playback in the background, request a continuous task and access the AVSession capability, which allows Control Panel to control the playback behavior of third-party applications.
## Are the APIs used for obtaining PPG and ECG sensor data open to individual developers?
Applicable to: OpenHarmony 3.1 Beta 5 (API version 9)
Data collected by the PPG and ECG sensors of wearable devices is personal privacy data. Therefore, relative APIs are not open to individual developers.
## What does the following error message mean: "Stage model module... does not support including OpenHarmony npm packages or modules in FA model. OpenHarmony build tasks will not be executed, and OpenHarmony resources will not be packed."
Applicable to: OpenHarmony SDK 3.2.5.3, stage model of API version 9
The third- and fourth-party libraries are not yet compatible with the stage model of API version 9 and cannot be used.
## Can I transfer project-level dependencies?
Applicable to: OpenHarmony SDK 3.2.5.3, stage model of API version 9
For example, if project A depends on project B and project B depends on project C, can project A directly use the APIs provided by project C?
No. Project A cannot directly use the APIs provided by project C. The project packing tool NPM does not support dependency transfer. To use the APIs provided by project C, you can add the dependency of project C to project A.
## How do I obtain available third-party libraries?
## How do I obtain available third-party libraries?
Applicable to: OpenHarmony SDK 3.2.6.5, stage model of API version 9
Applicable to: OpenHarmony 3.1 Beta 5 (API version 9)
For details, see [Third-Party Components That Can Be Directly Used on OpenHarmony](https://gitee.com/openharmony-sig/third_party_app_libs).
The three-party and four-party libraries that can be obtained through ohpm are summarized in the [OpenHarmony-TPC/tpc_resource repository](https://gitee.com/openharmony-tpc/tpc_resource). You can access this repository, and find the desired component based on the directory index.
## Which third-party libraries are related to network requests?
## Which third-party libraries are related to network requests?
Applicable to: OpenHarmony SDK 3.2.6.5, stage model of API version 9
Applicable to: OpenHarmony 3.1 Beta 5 (API version 9)
The following third-party libraries are related to network requests: [Axios](https://gitee.com/openharmony-sig/axios), httpclient, and okdownload. For details, see the [OpenHarmony-TPC/tpc_resource repository](https://gitee.com/openharmony-tpc/tpc_resource).
The [Axios](https://gitee.com/openharmony-sig/axios) library is related to network requests.
## How do I use ohpm to import third- and fourth-party libraries?
## How do I use NPM to import third- and fourth-party libraries?
Applicable to: OpenHarmony 3.1 Beta 5 (API version 9)
**Solution**
Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
- Method 1:
- Method 1:
1. Open the **Terminal** window and run the following command to go to the **entry** directory:
1. Open the **Terminal** window and run the following command to go to the **entry** directory:
```
```
cd entry
cd entry
```
```
2. Run the following command to install a third-party package, for example, **dayjs**:
2. Run the following command to install a third-party library, for example, **dayjs**:
```
```
npm install dayjs --save
ohpm install dayjs
```
```
3. Add the following statement in the .js file to import the package:
3. Add the following statement in the .js file to import the third-party library:
```
```
import dayjs from 'dayjs';
import dayjs from 'dayjs';
```
```
- Method 2:
- Method 2:
1. Enter the **entry** directory of the project and open the **package.json** file.
1. Enter the **entry** directory of the project and open the **oh-package.json5** file.
2. Write the third-party NPM package to be installed (for example, **dayjs**) in the **package.json** file.
2. Write the third-party library to be installed (for example, **dayjs**) in the **oh-package.json5** file.
```
```
{
{
...
@@ -57,17 +49,20 @@ Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
...
@@ -57,17 +49,20 @@ Applicable to: OpenHarmony SDK 3.2.5.5, stage model of API version 9
}
}
}
}
```
```
3. Open the **Terminal** window and run the following command to go to the **entry** directory:
3. Open the **Terminal** window and run the following command to go to the **entry** directory:
```
```
cd entry
cd entry
```
```
4. Run the following command to install NPM:
4. Run the following command to install the third-party library:
```
```
npm install
ohpm install
```
```
5. Add the following statement in the .js file to import the package:
5. Add the following statement in the .js file to import the third-party library:
letavoidAreaRect=data.regionTint[0].region;// data.regionTint is an array that contains the rectangle coordinates of the status bar and navigation bar.
