Dojo
Docs Tutorials Cookbook Blog

modern web apps

  • Access drag information
  • Manage state in your application
  • Use built-in Dojo ponyfills

performance

  • Visualize your bundle contents

rendering

  • Access a raw DOM node
  • Get the rendered dimensions of an element
  • Use JSX templating

routing

  • Generate dynamic hyperlinks
  • Render URL aware widgets
  • Get the dynamic components of a URL from within a widget

styling

  • Style a built-in widget using themes
  • Create a themeable widget
  • Style a virtual DOM node with simple CSS classes

testing

  • Test and mock the imports of a widget

widgets

  • Discover all built-in Dojo 2 widgets
  • Handle string localization within a widget
  • Lazy load a widget
  • Pass and receive properties with widgets
  • Render a list from an array
  • Render a built-in Dojo 2 widget
  • Build an SVG chart
  • Force a widget to re-render itself
  • Allow a widget to receive additional properties in TypeScript

Objective

Render a built-in Dojo 2 Button widget.

Procedure

  1. Import the Button widget:
import Button from '@dojo/widgets/button/Button';
  1. Import the widget render function:
import { w } from '@dojo/widget-core/d';
  1. Render the widget within an existing user-defined widget:
render() {
    return w(Button, {
        type: 'submit'
    }, ['Submit this form'])
}

Additional resources

  • The Working with forms tutorial includes more examples of using built-in Dojo 2 widgets
  • The dojo/widgets repository has detailed documentation on the button widget
© 2018 JS Foundation, All Rights Reserved.