Button Group

less than 1 minute read

References

TypeScript

import { Components } from "gd-sprest-bs";

// Create the buttonGroup
let el = document.querySelector("#buttonGroup");
let buttonGroup = Components.ButtonGroup({
    el: el,
    buttonType: $REST.Components.ButtonTypes.Primary,
    buttons: [
        { text: "Left" },
        { text: "Middle" },
        { text: "Right" }
    ]
});

React

import * as React from "react";
import { ButtonGroup, Components } from "gd-sprest-bsx";

export class IDemo extends React.Component {
    // Render the component
    render() {
        return (
            <ButtonGroup
                buttonType={Components.ButtonTypes.Primary}
                buttons={[
                    { text: "Left" },
                    { text: "Middle" },
                    { text: "Right" }
                ]}
            />
        );
    }
}

VueJS

<template>
    <ButtonGroup v-bind:button-type="buttonType" v-bind:buttons="buttons" />
</template>

<script>
import { Components } from "gd-sprest-bs";
import { ButtonGroup } from "gd-sprest-bs-vue";
export default {
    components: { ButtonGroup },
    data() {
        return {
            buttonType: Components.ButtonTypes.Primary,
            buttons: [
                { text: "Left" },
                { text: "Middle" },
                { text: "Right" }
            ]
        };
    }
}
</script>

Code Playground