Skip to content

Support passing Element into loading container property #247

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Sep 24, 2018
Merged

Conversation

OzairP
Copy link
Contributor

@OzairP OzairP commented Sep 18, 2018

Summary

This PR allows passing Element as the container property for the first parameter of Vue.prototype.$vs.loading

Rationale

Refs provide a direct link to the DOM that your component uses, using ID's in Vue is dangerous since components can be spun up and multiple ID's can exist.

Using the Vue ref api we can pass the element itself into the loader to yield a more precise and predictable behavior

Backwards Compatibility

This change is backwards compatible.

Example

<template>
    <vs-button class="vs-con-loading__container" vs-color="primary" vs-type="filled" @click="login">Login</vs-button>
</template>

<script lang="ts">
    import Vue from 'vue'
    import { Component } from 'vue-property-decorator'

    @Component()
    export default class Login extends Vue {
        public login () {
            this.$vs.loading({
                container: (this.$refs.login as Vue).$el,
                background: 'primary',
                color: '#FFFFFF',
                scale: 0.45
            })
        }
    }
</script>

@luisDanielRoviraContreras luisDanielRoviraContreras merged commit 724313c into lusaxweb:master Sep 24, 2018
Tofandel pushed a commit to Tofandel/fixed-vuesax that referenced this pull request Apr 26, 2021
Support passing Element into loading container property
Tofandel pushed a commit to Tofandel/fixed-vuesax that referenced this pull request Apr 26, 2021
Support passing Element into loading container property
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants