Salesforce コンソール開発者ガイド
jLightning Experience の setTabHighlighted()
指定されたタブを異なる背景色とバッジで強調表示します。タブの強調表示は、Lightning コンソールアプリケーションを再読み込みすると保持されなくなります。このメソッドは、Lightning コンソールアプリケーションでのみ機能します。
引数
| 名前 | 型 | 説明 |
|---|---|---|
| tabId | string | 強調表示するタブの ID。 |
| highlighted | boolean | タブが強調表示されるかどうか。異なる背景色を設定してユーティリティを強調表示します。 |
| options | object | 省略可能。強調表示されるタブの外観を変更する追加オプション。選択可能なオプションは次のとおりです。
|
)、warning (
)、error (
) です。LWC のサンプルコード
このコンポーネントは、自身が Lightning コンソールアプリケーション内にあるかどうかを確認してから、フォーカスされたタブに関する情報を返して、そのタブを強調表示します。
1import { LightningElement, wire } from 'lwc';
2import { IsConsoleNavigation, getFocusedTabInfo, setTabHighlighted } from 'lightning/platformWorkspaceApi';
3
4export class HighlightTabExample extends LightningElement {
5 @wire(IsConsoleNavigation) isConsoleNavigation;
6
7 handleClick() {
8 if (this.isConsoleNavigation) {
9 getFocusedTabInfo().then((tabInfo) => {
10 setTabHighlighted(tabInfo.tabId, true);
11 });
12 }
13 }
14}Aura コンポーネントのサンプルコード
このコンポーネントにはボタンがあり、押すと、フォーカスされているタブが強調表示されます。
コンポーネントコード:
1<aura:component implements="flexipage:availableForAllPageTypes" access="global" >
2 <lightning:workspaceAPI aura:id="workspace" />
3 <lightning:button label="Set Focused Tab Highlighted" onclick="{! c.setFocusedTabHighlighted }" />
4</aura:component>コントローラーコード:
1({
2 setFocusedTabHighlighted : function(component, event, helper) {
3 var workspaceAPI = component.find("workspace");
4 workspaceAPI.getFocusedTabInfo().then(function(response) {
5 var focusedTabId = response.tabId;
6 workspaceAPI.setTabHighlighted({
7 tabId: focusedTabId,
8 highlighted: true,
9 options: {
10 pulse: true,
11 state: "success"
12 }
13 });
14 })
15 .catch(function(error) {
16 console.log(error);
17 });
18 }
19})応答
このメソッドは、成功時に変更されたタブを表す tabInfo オブジェクトに解決される Promise を返します。tabInfo オブジェクトは、ワークスペースタブに関する情報の JSON 配列で、各サブタブに関する情報の配列がネストされています。tabInfo オブジェクトの構造を次に示します。
1{
2 tabId: string,
3 url: string (URL),
4 pinned: boolean,
5 closeable: boolean,
6 title: string,
7 icon: string (SLDS iconKey),
8 iconAlt: string,
9 customTitle: string (optional),
10 customIcon: string (optional),
11 customIconAlt: string (optional),
12 highlighted: boolean,
13 pageReference: object,
14 isSubtab: boolean,
15 parentTabId: string,
16 subtabs: [
17 {
18 tabId: string,
19 url: string (URL),
20 pinned: boolean,
21 closeable: boolean,
22 title: string,
23 icon: string (SLDS iconKey),
24 iconAlt: string,
25 customTitle: string (optional),
26 customIcon: string (optional),
27 customIconAlt: string (optional),
28 highlighted: boolean,
29 pageReference: object,
30 isSubtab: boolean,
31 parentTabId: string,
32 focused: boolean,
33 recordId: string,
34 },
35 ...
36 ],
37 focused: boolean,
38 recordId: string
39}