tyoshikawa1106のブログ

- Force.com Developer Blog -

SFDC:Lightning Experience開発でaタグ使用時に注意すること

別ページにリンクする際に使用するaタグですが、タブ切り替えの実装などでも利用します。こんなとき『<a href="#">』というような指定の仕方をする場合があるんじゃないかと思います。


Lightning ApplicationやSalesforce1モバイルの開発では特に問題なかったと思うのですが、Lightning Experience用の画面でこれを行うとクリック時にトップページに戻る仕様となっています。(Lightning ExperienceのURLの仕組み的にこのような挙動となるみたいです。)


ということでhref="#"については宣言しないように作っておくと後々困ったことになるのを回避できると思います。(別の解決方法を教えてもらいました。一番下に追記しました。)

f:id:tyoshikawa1106:20151030081314p:plain

追記 (2015/11/01)

この問題の別の解決方法を教えてもらいました。『preventDefault()』をきちんと宣言しておけば正しく動作してくれたみたいです。(preventDefaultってjQueryで利用できるものだと勘違いしていたのですが、普通にJavaScriptで利用できました。古いブラウザなどではサポートしてないのもあるかもしれません。)


Lightning Component開発の場合は次のような感じで書けます。
f:id:tyoshikawa1106:20151101015007p:plain


Developer環境で確認したところ、この対応で問題なく動作してくれるようになりました。基本的には『href="#"』は宣言せずに開発しておいて大丈夫みたいですが、こういう解決方法があることを覚えておくと困ったときに対応の幅が広がるんじゃないかなと思います。


(そういえば引数のeventってLightning専用のものだと思ってましたが、普通にJSのイベント変数だったんですね〜)

『preventDefault』の参考