Skip to navigation

Instance Methods

Control a created widget instance after TradingWidget.create().

View as Markdown

Method Summary

MethodPurpose
destroy()Remove the iframe and release event listeners.
getState()Read the current SDK lifecycle state.
whenReady()Wait until the iframe finishes initialization.
setSymbol(symbol)Switch the trading pair inside the iframe.
setTheme(theme)Update the iframe theme parameter.
setLocale(locale)Switch the iframe language.
setSize(width, height)Update iframe dimensions.
reload()Reload the current iframe.
refreshAuth(reason)Trigger the widget auth refresh flow.
setTokenProvider(provider)Replace the provider used by partner-token mode.
on(event, handler)Subscribe to runtime events and receive an unsubscribe function.

destroy()

Remove the iframe, clear listeners, and emit destroyed once for the current instance.

widget.destroy()

getState()

Read the current lifecycle state of the widget instance.

const state = widget.getState()

Return values include loading, authenticating, ready, error, and destroyed.

whenReady()

Wait for the iframe to finish initialization before running dependent UI logic.

await widget.whenReady()

setSymbol(symbol)

Switch the trading pair inside the iframe. If the iframe is still initializing, the SDK queues the command and sends it after ready.

widget.setSymbol('ETHUSDT')

setTheme(theme)

Update the theme parameter used by the embedded trading iframe.

widget.setTheme('dark')
widget.setTheme('light')

setLocale(locale)

Switch the iframe language. Supported values are en, en-US, and zh-CN.

widget.setLocale('en')
widget.setLocale('en-US')
widget.setLocale('zh-CN')

setSize(width, height)

Update the iframe DOM size and notify the iframe about the new outer size. Numeric values are converted to px.

widget.setSize('100%', 720)

reload()

Reload the current iframe and wait for it to initialize again.

widget.reload()

refreshAuth(reason)

Ask the iframe to refresh the current authentication flow. The optional reason value is forwarded for logging and flow control.

widget.refreshAuth('manual')

setTokenProvider(provider)

Replace the tokenProvider used by partner-token mode. The SDK calls the provider when the iframe requests a fresh embed token.

widget.setTokenProvider(async ({ channelId, symbol, reason }) => {
const resp = await fetch('/api/trading/embed-token', {
method: 'POST',
credentials: 'include',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ channelId, symbol, reason }),
})
return resp.json()
})

on(event, handler)

Subscribe to a runtime event. The returned function removes the listener.

const off = widget.on('order_created', (event) => {
console.log(event)
})
off()

Additional methods in the current v1 runtime

MethodPurpose
whenRendered()Wait for the iframe’s rendered notification; this is separate from ready.
setPage(page)Request a supported product page in the current instance. It does not change funds environment.
prepareForRecreate()Ask a ready iframe to prepare for replacement; returns a promise and can reject if unavailable, busy or timed out.
cancelRecreate()Cancel a pending/prepared replacement flow.
TradingWidget.validateOptions(options)Validate initialization options before creating an instance.

For a user or real/demo environment change, destroy the old instance and create a new one with the target authentication and mode. Do not use setPage as an environment switch. Check capabilities before using optional methods.

if (TradingWidget.capabilities.methods.includes('whenRendered')) {
await widget.whenRendered();
}
if (TradingWidget.capabilities.pages.includes('up-down')) {
widget.setPage('up-down');
}