Question

试图弄清楚如何在vuejs方法中使用Jquery函数。我试图使用fadeOut（）函数，但是没有用，因为我认为我需要使用jQuery对象。我尝试了一些东西，但是没有用。有什么想法可以做到这一点吗？

<script>
const app = new Vue({
    el: '#app',
    data: {
        message: 'Hello Vue.js!'
    },
    mounted() {

    },
    methods: {
        removeParticipant(participant_id) {
            axios.post('/api/tournament/removeParticipant', {
                tourn_id: {{ $tournament->id }},
                participant_id: participant_id
            })
            .then((response) => {
                if(response.data == 'ok') {
                    $ele = window.$(this);
                    $ele.fadeOut().remove();
                    alert($ele);
                }
            })
            .catch(function(error) {
                console.log(error);
            })
        }
    }
});

Answer 1

如果要尝试使用此代码，是否要淡出ID为#app的div？在vue初始化之后，获取元素并将其存储在这样的变量中：

const app = new Vue({
el: '#app',
data: {
    message: 'Hello Vue.js!'
},
mounted() {

},
methods: {
    removeParticipant(participant_id) {
        axios.post('/api/tournament/removeParticipant', {
            tourn_id: {{ $tournament->id }},
            participant_id: participant_id
        })
        .then((response) => {
            if(response.data == 'ok') {
                //$ele = window.$(this); ///////comment this section
                $ele.fadeOut().remove();
                alert($ele);
            }
        })
        .catch(function(error) {
            console.log(error);
        })
    }
}
});

var $ele = $('#app');//////////////declare your variable after vue initialization

在vue.js中使用jQuery函数

1 个答案: