CSS 爱心按钮动画

2024-01-09 22:13:22

    <template>
    	<view class="content">

    		<view class="label" @click="toggleFavorite">
    			<img class="heart" :class="{ heartt: isChecked }"
    				:src="isChecked ? '../../static/A.png' : '../../static/B.png'" alt="Favorite" />
    			<view class="action">
    				<view class="option-1" :class="{ active: isChecked }">我喜欢你</view>
    				<view class="option-2" :class="{ active: !isChecked }">不喜欢你</view>
    			</view>
    		</view>
    	</view>
    </template>

    <script setup>
    	import {
    		ref
    	} from 'vue';

    	const isChecked = ref(false);

    	function

文章来源:https://blog.csdn.net/weixin_54226053/article/details/135489634
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。