widget

方法概述

方法详细说明

accessibleHandler(){Function}

此便利装饰器用于帮助简化微件键盘事件中的可访问性。例如，它可用于在按下 space 或 enter 键时执行一个方法。

返回

类型	描述
Function	属性描述符。

示例

// .tsx syntax providing accessibility on a widget method
@accessibleHandler()
reset: () => void;

cssTransition(type, className){Function}

起始版本：GeoScene Maps SDK for JavaScript 4.7

用于创建 CSS 动画/过渡函数的实用方法。

参数

type String 动画/过渡类型。 可能值："enter"|"exit"

className String 动画/过渡类名称。

返回

类型	描述
Function	动画/过渡函数。

示例

// .tsx syntax showing how to set up node enter/exit animations

render() {
  const content = this.visible ? (
    <div enterAnimation={cssTransition("enter", CSS.fadeIn)}
         exitAnimation={cssTransition("exit", CSS.fadeOut)}>
      I fade in and out.
    </div>
  ) : null;

  return (
    <div class={CSS.base}>{content}</div>
  );
}

isActivationKey(key){Boolean}

起始版本：GeoScene Maps SDK for JavaScript 4.19

实用程序的方法，用于确定按下的键是否应该激活按钮的行为。如果返回的 KeyboardEvent.key 为 Enter 或空格 (" ")，则返回 true。

参数

key String KeyboardEvent.key

返回

类型	描述
Boolean	表示按下的键盘键是 Enter 还是空格 (" ")。

另请参阅

• https://developer.mozilla.org/en-US/docs/Web/API/KeyboardEvent/key

isRTL(){Boolean}

起始版本：GeoScene Maps SDK for JavaScript 4.9

用于确定文档文本的方向性是否从右到左的实用方法。

返回

类型	描述
Boolean	true ，如果文档文本的方向性是从右到左。

messageBundle(bundleId){Function}

起始版本：GeoScene Maps SDK for JavaScript 4.18

此便利装饰器用于帮助简化微件的本地化。装饰属性很有用，该属性将自动填充由标识符 bundleId 指定的本地化消息绑定。可以在 render() 函数中使用该属性来显示本地化内容。

当实例化微件时，将加载所有消息包并分配给它们相应的属性。调用微件的 postInitialize 方法，然后调用第一个渲染。

当区域设置发生变化时，将重新加载和分配所有活动微件的所有消息包。然后，同时渲染微件。

如果函数在微件外使用已翻译的字符串，请改用 intl.fetchMessageBundle。

注意，首次调用 render() 只发生在所有通过 @messageBundle 装饰的属性都使用相应的包填充之后。

参数

bundleId String optional 传递给 intl.fetchMessageBundle() 的包标识符。

返回

类型	描述
Function	属性装饰器。

另请参阅

• 示例 - 创建自定义微件

• intl.fetchMessageBundle()
• intl.registerMessageBundleLoader()

示例

// .tsx syntax to define a message bundle property
@property()
@messageBundle("my-application/MyBundle")
messages: { [key: string]: any };

render() {
  return (
    <div>{this.messages.myMessage}</div>
  );
}

storeNode(node)

起始版本：GeoScene Maps SDK for JavaScript 4.6

此便利方法用于将 HTMLElement DOM 节点引用分配给一个变量。它通过获取从 afterUpdate 或 afterCreate 回调传递的 HTMLElement 来实现这一点。要使用它，元素必须设置 data-node-ref 属性。此外，它还必须绑定到微件实例，例如 bind={this}。

参数

node HTMLElement 引用的 DOM 节点。

另请参阅

• 自定义微件渲染指南主题。

示例

// The storeNode function is called after the node is
// added to the DOM. Bind the node to the widget and
// pass in the node's root element name.

render() {
  return (
    <div afterCreate={storeNode} bind={this} data-node-ref="rootNode" />
  );
}

tsx(selector, properties, children){Object}

起始版本：GeoScene Maps SDK for JavaScript 4.4

此便利方法用于在 widget.render() 方法中渲染 JSX。即使没有显式调用它，也需要导入 tsx。

参数

selector String 要创建的元素。

properties Object optional 元素的属性。

children Object optional 元素的子元素。

返回

类型	描述
Object	虚拟节点。

示例

// .tsx syntax importing jsxfactory
import { tsx } from "geoscene/widgets/support/widget";

vmEvent(eventNames){Function}

此便利装饰器有助于在 widget 实例上分派视图模型事件。

参数

eventNames String|String[] 要重新调度的事件名称。

返回

类型	描述
Function	属性装饰器。

示例

// .tsx syntax dispatching view model events
@property()
@vmEvent("search, search-clear, suggest")
viewModel: SearchViewModel;

类型定义

GoToOverride(view, goToParameters)

以下属性定义了一个 goTo 覆盖函数。

参数

规范

view MapView|SceneView 对发生导航的 MapView 或 SceneView 的引用。

goToParameters Object 传递给 IMapView's goTo() 或 SceneView's goTo() 方法的覆盖目标和可选参数。 规范 target GoToTarget2D|GoToTarget3D 要设置动画的目标位置/视点/范围。 options GoToOptions2D|GoToOptions3D optional 定义导航动画、持续时间和缓和效果的选项。