vue实现简单的点击切换颜色


<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>changeColor</title>
    <script src="https://unpkg.com/vue/dist/vue.js"></script>
</head>
<style>
    div {width: 100px;height: 100px;background: lightcoral;}
    .changeColor {background: lightgreen;}
</style>

<body>

    <section id="app">
        <div :class="{changeColor}" @click="changeColor =! changeColor">
        </div>
    </section>

    <script>
        new Vue({
            el: '#app',
            data: {
                changeColor: false
            }
        })
    </script>
</body>

</html>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM