The content of this page has been automatically translated by AI. If you encounter any problems while reading, you can view the corresponding content in Chinese.
Help & Documentation>IoT Explorer>Legacy Document>Application Side Development Guide>Tencent Lianlian Custom H5 Development>H5 Custom Development SDK>Interface Components

Interface Components

Last updated: 2025-04-28 10:54:42

On this page:

tips Component

tips component, style and style match Tencent Lianlian Mini Program.

Basic Usage

API definition
sdk.tips.show(message, options) => Promise
{parameter description}
Parameter Name
Type
Required
Parameter Description
message
string
Yes
Prompt text.
options.type
'info'
'danger'
'loading'
'success'
No
tips type.
options.waitForHide
boolean
No
If it is true, the show method returns a Promise, and the resolve will only be triggered after closing.
options.duration
number
No
The time when the notification shows, in milliseconds, default 1500.
options.delayDuration
number
No
The default value is 0, in milliseconds. The prompt will show after this delay.
options.canClickClose
boolean
No
Set to true by default. Whether it is possible to close prompt by clicking mask.
options.canBeReplace
boolean
No
Default to false. When it is false, if the previous notification is not closed, subsequent calls to tips.show will be ignored.

Close Prompt

Interface Definition
sdk.tips.hide() => Promise

Display a Loading Notification

The encapsulated tips.show method is equivalent to:
sdk.tips.show(message, {
  type: 'loading',
  canBeReplace: true,
  duration: 0,
  delayDuration: 200,
  canClickClose: false,
  ...options,
});
API definition
sdk.tips.showLoading(message, options) => Promise
{parameter description}
Please see parameter description of displaying tips.

Close Loading Notification

Show loading tips. You must proactively call this API, otherwise the tips will be kept.
Interface Definition
sdk.tips.hideLoading() => Promise

Display a Success Notification

The encapsulated tips.show method is equivalent to:
sdk.tips.show(message, { type: 'success', ...options });
API definition
sdk.tips.showSuccess(message, options) => Promise
Parameter Description
Please see parameter description of displaying tips.

Display General Notifications

The encapsulated tips.show method is equivalent to:
sdk.tips.show(message, { type: 'info', ...options });
API definition
sdk.tips.showInfo(message, options) => Promise
Parameter Description
Please see parameter description of displaying tips.

Display Error Notifications

First perform standardized processing on error display information, then show error tips. Equivalent to:
sdk.tips.show(getErrorMsg(error), { type: 'error', ...options });
API definition
sdk.tips.showError(error, options) => Promise
{parameter description}
Parameter Name
Type
Required
Parameter Description
error
Error
{ code, msg }
string
Yes
Error object or error information.
options
object
No

Modal Dialog Box

Basic Usage

Show a popup. Its parameters, functionality and style are basically the same as the native showModal of the mini program.
API definition
sdk.tips.showModal({
     title?: string,
     content?: string,
     showCancel?: boolean,
     cancelText?: string,
     cancelColor?: string,
     confirmText?: string,
     confirmColor?: string,
}) => Promise<boolean>
Parameter Description
Parameter Name
Type
Required
Parameter Description
title
string
No
Pop-up title
content
string
No
Pop-up content.
showCancel
boolean
No
Whether to display the cancel button. Set to true by default.
cancelText
string
No
Cancel button text, defaults to "Cancel".
cancelColor
string
No
Cancel button color, default is "#6C7078".
confirmText
string
No
Confirmation button text, defaults to "Confirm".
confirmColor
string
No
Confirmation button color, default is "#0066FF".
Return Value
Return a Promise<boolean>. Output values are as follows:
true: User clicks Confirm
false: User clicks Cancel

Confirm Modal Dialog Box

Encapsulation based on sdk.tips.showModal, for use in confirming operations with users twice.
API definition
sdk.tips.confirm(title, content, options) => Promise<boolean>
{parameter description}
Parameter Name
Type
Required
Parameter Description
title
string
No
Pop-up title
content
string
No
Pop-up content.
options
object
No
Sample code
const isConfirm = await sdk.tips.confirm('Confirm deletion of the device?');
if (isConfirm) {
  // User confirmation, execute subsequent process
}

Prompt Modal Dialog Box

Encapsulation based on sdk.tips.showModal, used for producing message prompts when operating for users.
API definition
sdk.tips.alert(content, options) => Promise<boolean>
{parameter description}
Parameter Name
Type
Required
Parameter Description
content
string
No
Pop-up content.
options
object
No
Example code
Produce a message prompt for the user.
await sdk.tips.alert('The feature is temporarily unavailable. Try again later.');

Device Offline Prompt Component

Prompt component for offline devices, with the same style as the Tencent Lianlian Mini Program.

Basic Usage

API definition
// Calling method 1
sdk.offlineTip.show() => void
// Calling method 2
sdk.showOfflineTip() => void

Close Prompt

API definition
// Calling method 1
sdk.offlineTip.hide() => void
// Calling method 2
sdk.hideOfflineTip() => void

H5 Custom Device Detail View

Display Device Detail View

Currently show a full-screen device detail view in H5, support adding custom menu items and buttons.
API definition
sdk.showDeviceDetail({
    deviceInfo?: object,
    labelWidth?: number,
    marginTop?: number,
    shareParams?: object,
    extendItems?: ExtendItemConfig[],
    extendButtons?: ExtendButtonConfig[],
    containerClassName?: string
}) => void
Parameter Description
Parameter Name
Type
Required
Parameter Description
extendItems[].label
string
Yes
Title of custom menu item.
extendButtons[].text
string
Yes
Custom button text.
extendButtons[].onClick
function
Yes
Callback triggered after clicking the custom button.
deviceInfo
object
No
Display details of equipment information. If not provided, use the current device information.
labelWidth
number
No
The label width of device detail, default 110, unit px.
marginTop
number
No
Padding-top of device detail: The default value is 10, and the unit is px.
shareParams
object
string
No
Custom share parameters.
extendItems
ExtendItemConfig[]
No
Custom menu configuration.
extendItems[].labelIcon
string
No
The icon address displayed in front of the label.
extendItems[].content
string
No
The content of a custom menu item.
extendItems[].className
string
No
Style class name of custom menu item.
extendItems[].onClick
function
No
Callback triggered after clicking a custom menu item.
extendButtons
ExtendButtonConfig[]
No
Custom button configuration.
extendButtons[].className
string
No
Style class name of the custom button.
extendButtons[].type
'danger'
'primary'
'warning'
No
Style of the custom button.
containerClassName
string
No
Style class name of the container.

Close Device Detail View

Interface Definition
sdk.hideDeviceDetail() => void

中国站 - English