CODEWITHSUNDEEP
javascriptecmascript-6polymerpolymer-2.xes6-class
Let Me Tink About It
Let Me Tink About It

Reputation: 16112

Polymer 2.x: Behavior mixins using class extension; error: Class constructor cannot be invoked without 'new'

I'm trying to implement behavior mixins using class extensions as described here and here.

settings-list-text.html 
<link rel="import" href="settings-item-switch.html">
...
<script>
  class SettingsListText extends SettingsItemSwitch(Polymer.Element) {

But I keep getting the following console error.

settings-list-text.html:32 Uncaught TypeError: Class constructor SettingsItemSwitch cannot be invoked without 'new' at settings-list-text.html:32

settings-item-switch.html 
<script>
  class SettingsItemSwitch extends Polymer.Element {

How can I use Polymer 2.x to import my custom behavior mixins using class es6 extensions?

Upvotes: 1

Views: 293

Answers (2)

Jerome Llanda
Jerome Llanda

Reputation: 1

You can do something like this.

const { SettingsItemSwitch } = [your namespace].[mixins_dir];
class SettingsListText extends SettingsItemSwitch(Polymer.Element) {
  ...
}

Namespace can be window.AppName and mixins_dir is where your mixins are.

Upvotes: 0

Amit Merin
Amit Merin

Reputation: 1936

Take a look at https://www.polymer-project.org/2.0/docs/devguide/custom-elements#mixins

Your mixin code should look something like this:

<script>
    /**
     * @mixinFunction
     * @polymer
     */
    MyMixin = (superclass) =>
        /**
       * @mixinClass
       * @polymer
       */
        class extends superclass {
            constructor() {
                super();
            }

            myFunc(myParam) {
                //do something
            }
        }
</script>

Upvotes: 2

Related Questions