How to use the skatejs.withUpdate function in skatejs

To help you get started, we’ve selected a few skatejs examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github trusktr / vue-web-component / src / index.js View on Github external
// surprises (or uglier code that conditionally checks for both forms of the
    // spec).
    const Component = Vue.extend( vueComponent )

    // map from Vue prop types to SkateJS prop types
    const vuePropTypes = makeVuePropTypes( vueComponent.props )

    // contains scope ID of this element's Vue component as well as sub component
    // IDs
    const scopeIds = getAllScopeIds( vueComponent )

    // this will contain all CSS rules for this element's Vue component and
    // sub-components
    let matchingRules = null

    return class VueWebComponent extends withUpdate( withRenderer( ElementClass ) ) {

        constructor(...args) {
            super(...args)

            console.log(' --- VueWebComponent.constructor')

            this.vue_instance = new Component
            this.vue_instancePromise = null
            this.vue_mounted = false
        }

        /**
         * Define a renderer that mounts a Vue component in this element's shadow
         * root.
         */
        renderer( root, render ) {
github trusktr / vue-web-component / src / index.js View on Github external
// pass this.props as first arg, whose keys are iterated on in
            // forChangedProps, otherwise nothing happens the first time
            // because prevProps is empty at first.
            forChangedProps( this.props, prevProps, ( name, oldVal ) => {
                // pass the value along
                this.vue_instance[ name ] = this[ name ]
            })
        }

    }

}

// a hack class used so we don't conflict with Vue's builtin  component. Is there a better way?
class RealSlot extends withLifecycle( withUpdate( HTMLElement ) ) {
    constructor(...args) {
        super(...args)
        this.style.display = 'contents'
    }

    connected() {
        if (this.actualSlot) return
        this.actualSlot = document.createElement('slot')
        this.appendChild(this.actualSlot)
    }

    static get props() {
        return {
            name: Object.assign({}, skatePropTypes.string, {attribute: true} )
        }
    }
github skatejs / skatejs / site / pages / mixins / __samples__ / with-update.js View on Github external
import { props, shadow, withUpdate } from 'skatejs';

class WithUpdate extends withUpdate() {
  static get props() {
    return {
      name: props.string
    };
  }
  updated() {
    shadow(this).innerHTML = `Hello, ${this.name}!`;
  }
}

customElements.define('with-update', WithUpdate);