Winter'17 リリースノート輪読 ~Lightning編~ #Salesforce

自己紹介

山﨑　真吾
株式会社チームスピリット
Twitter: @zaki___yama
Qiita, GitHub: @zaki-yama

はじめに

リリースノートのうち、

から気になった機能をいくつか紹介します。

ほとんど先日の開発者向け Webinar で話されてたやつです。

Lightning Experience (LEX) 編

ナビゲーションバー

これまでの左側のメニューが刷新され、Classic と同じように上部に表示。

(Winter '17 開発者向け新機能Webセミナー
p9 より引用)

アプリケーションランチャー

どのアプリを開いていても素早くアプリ切り替えが可能に。

カスタムアプリケーションの作成

LEX 用アプリケーション。ロゴやブランドカラーなどカスタマイズ可能。
（設定はアプリケーション > アプリケーションマネージャ　から）

(続)カスタムアプリケーションの作成

Classic アプリと Lightning アプリが「アプリケーション種別」で区別される
アプリケーション種別:Lightning じゃないと LEX では表示されない

気になったので
調べてみたこと

Q. 「アプリケーション種別」の違いって何で生じるの？

A. Classic 画面で作成したアプリは Classic, LEX で作成したアプリは Lightning です。

メタデータ的には CustomApplication に
<uiType>Lightning</uiType> がついてるのが Lightning のようです。

（かわりに、Classic には <defaultLandingTab> が入ってたり）

Q. (続)「アプリケーション種別」の違いってどこで生じるの？

Classic から Lightning へは「アップグレード」により変換することができます。
変換といっても Classic 版はそのままで新たに Lightning 版が作成されます。

Q. 結局、ナビゲーションバーに表示できるアイテムは何種類？

A. 基本、ユーザインタフェース > タブ　で作成できるタブがそれに該当します。
（Summer'16 までのメニューと変わらず）

カスタムオブジェクト
Visualforce
Lightning Component
implements="force:appHostable" するやつですね
Lightning ページ
App Builder で作成したページのこと

加えて、なぜか「アプリケーションランチャー」が選べる

Q. アプリケーションランチャーからアプリを非表示にするには？

A. 「アプリケーションメニュー」という設定があり、そちらで表示／非表示を設定できます。

Lightning Component 編

LockerService の有効化 -> Spring'17 に延期

LockerService については:

元々 Summer'16 でON/OFF切り替え可能、Winter'17 から適用のはずだった

[英語] `e.force:navigateToComponent` (Beta)

コンポーネント間遷移を実現するイベント。ベータ

navigateToMyComponent : function(component, event, helper) {
  var evt = $A.get("e.force:navigateToComponent");
  evt.setParams({
    componentDef : "c:myComponent",
    componentAttributes: {
      contactName : component.get("v.contact.Name")
    }
  });
  evt.fire();
}

試してないです

Lightning App での　Lightning Design System の使用

extends="force:slds" つけると LDS が自動で読み込まれます
常に最新バージョン = バージョン固定できない　（のはず）。。。

Lightning カスタムアクション

レコード詳細画面のボタンから Lightning Component を起動
コンポーネントに implements="force:lightningQuickAction" をつける
- または force:lightningQuickActionWithoutHeader

Lightning Data Service (Developer Preview)

Visualforce でいう Standard Controller
Apex を使わずにレコードの取得や保存が行える
FLS（項目レベルセキュリティ）が自動的に考慮される（参考）

コンポーネント

<force:recordPreview aura:id="propertyService" 
                     recordId="{!v.recordId}" 
                     targetRecord="{!v.property}" 
                     fields="['Id', 'Status__c']"
                     recordUpdated="{!c.recordUpdated}"
                     mode="EDIT" />

コントローラ(JS)

recordUpdated : function(component, event, helper) {
var changeType = event.getParams().changeType;
    if (changeType === "CHANGED") { 
        var service = component.find("propertyService");
        service.reloadRecord();
    }
}

DEMO

DreamHouse アプリをインストールしよう
それぞれの機能に対応するコンポーネントは以下
- Lightning アクション： SmartHome, SmartHomeCard
- Lightning Data Service： PropertyStatus
インストール面倒、という方は Dreamforce Dev Keynote のデモをご覧ください
- Keynote の内容紹介記事も書いた

余談ですが: Lightning Utility Bar?

画面の下からにょきって出て来るアレ
Dreamforce のデモで見たけどリリースノートではまだでした
DreamHouse 英語版の方をインストールすると表示されます

Winter'17 リリースノート輪読 ~Lightning編~