select

import { create, append, $ } from './util.js';
export default class Select {
    options = ['car', 'bicycle'];
    constructor($target) {
        this.$target = $target;
        this.$select = create('select');
        this.$select.style = "height: 300px;";

        this.$select.onchange = this.onSelect;

        append(this.$select);
        this.render();
        console.log('SELECT created');
    }

    onSelect = (e) => {
        if (e.target.type == 'select-one')
            console.log(e.target, e.target.value, e.target.name);
    }

    render() {
        this.$select.innerHTML = ['select', ...this.options].map((option, i) => `
            <option value="${option}" name="${option}">${option}</option>
        `).join('');

    }
}