The vue-button-spinner from wanxe

vue-button-spinner's People

Contributors

Stargazers

Watchers

vue-button-spinner's Issues

isLoading prop needs to be used as is-loading

The example shows the use of an isLoading prop. In fact, I had to change to is-loading to get it to work (camelCase required in JavaScript, kebab-case in the HTML).

Source: https://vuejs.org/v2/guide/components-props.html

Wrong component name on read.me

The correct component name is vue-button-spinner, instead of button-spinner.

Just leaving it here if someone needs.

how to edit css

may be you can add some dynamic css because currently it is showing very small button

Problem with showing spinner in button

Hi. Thanks for nice library. I'm using this library to show progress with calling web apis. I followed your guide line in Readme.md, but I noticed that 'isLoading' property works incorrectly. How can I solve this problem? The below is my code which uses your library.

Template side

<template>
<vue-button-spinner :isLoading="isLoading" :disabled="isLoading" :status="status" @click.native="trainChatbot"><span>Train a chatbot</span></vue-button-spinner>
</template>

Script side

import VueButtonSpinner from 'vue-button-spinner';

export default {
    components : {
        VueButtonSpinner
    },

@A method is called.

axios.post(train_url, payload, config).then(res => {
            if(res.data["result"]) {
                // alert("챗봇 훈련 성공!");
                this.$vs.notify({
                    title : "챗봇 훈련 성공",
                    text: "챗봇의 훈련이 성공하였습니다. 대화를 시작해보세요!",
                    color:'success',
                    position : 'bottom-right'
                })
                this.isLoading = false;
                localStorage.setItem("isLoading", false);
                this.status = true;
            } else {
                    this.$vs.notify({
                    title : "챗봇 훈련 실패",
                    text: "챗봇 훈련 실패! - 네트워크 연결을 확인하세요!",
                    color:'danger',
                    position : 'bottom-right'
                })
                this.isLoading = false;
                localStorage.setItem("isLoading", false);
                this.status = false;
                // alert("");
            }

Recommend Projects