实现箭头翻转,查询条件展开收起

箭头翻转,查询条件展开收起

示例如下:

const showmore = ref(false)
const showflag = ref(true)
const showMore = () => {
	const element = document.querySelector(".show_arrow");
	if (showflag.value) {
    	element.classList.add("icon-arrow-rotate");
	} else {
     element.classList.remove("icon-arrow-rotate");
 	}
   showmore.value = !showmore.value
   showflag.value = !showflag.value
}

<style >
.icon-arrow-rotate {
    /*旋转180度*/
    transform: rotate(180deg);
}
</style>

你可能感兴趣的:(css,前端,html5)