materio-d8/web/themes/custom/materiotheme/vuejs/components/Form/SearchForm.vue

<script>

import Vue from 'vue'

export default {
  props: ['form'],
  data() {
    return {
      template: null,
      typed: ""
    }
  },
  methods: {
    keyup() {
      console.log("search typed", this.typed);
    },
    submit() {
      console.log("search clicked");
    }
  },
  beforeMount() {
    // console.log('SearchForm beforeMount');
    if(this._props.form){
      // console.log('SearchForm beforeMount if this._props.form ok');
      this.template = Vue.compile(this._props.form)
      // https://github.com/vuejs/vue/issues/9911
      this.$options.staticRenderFns = [];
      this._staticTrees = [];
      this.template.staticRenderFns.map(fn => (this.$options.staticRenderFns.push(fn)));
    }
  },
  mounted(){
    // console.log('SearchForm mounted');
    Drupal.attachBehaviors(this.$el);
  },
  render(h) {
    // console.log('searchForm render');
    if(!this.template){
      return h('span', 'Loading ...')
    }else{
      return this.template.render.call(this)
    }
  }
}
</script>

<style lang="scss" scoped>


</style>