How to use the @material/textfield.MDCTextfield function in @material/textfield

});
    notifyControl.addEventListener('change', () => {
      this._model.settings.notify.value = notifyControl.checked;
    });

    // Handle common values.
    this._commonValues = [];
    const commonValueControls =
        this._screen.querySelectorAll('.mm-js-common-value');

    const labels = ['first', 'second', 'third'];

    for (let i = 0; i < commonValueControls.length; i++) {
      const control = commonValueControls[i];
      const input = control.querySelector('input');
      this._commonValues.push(new MDCTextfield(control));

      // Update model when values change.
      input.addEventListener('change', () => {
        if (input.value !== '') {
          this._model.common[labels[i]].home.value = parseFloat(input.value);
        }
      });

      // Set initial values and listen to model changes.
      input.value = this._model.common[labels[i]].home.value;
      this._model.common[labels[i]].home.listen((val) => (input.value = val));
    }
  }

mounted() {
        this.mdcTextfield = new MDCTextfield(this.$el)
       
        if (this.interactive && this.box)
            this.mdcRipple = new MDCRipple(this.$el)
    },
    destroyed() {

mounted: function() {
    this.textfield = new MDCTextfield(this.$refs.root);
  }
};

mounted() {
        this.mdcTextfield = new MDCTextfield(this.$el)
    },
    destroyed() {