惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

博客园 - 三生石上(FineUI控件)
Blog — PlanetScale
Blog — PlanetScale
B
Blog
GbyAI
GbyAI
爱范儿
爱范儿
月光博客
月光博客
N
Netflix TechBlog - Medium
T
Tailwind CSS Blog
G
Google Developers Blog
大猫的无限游戏
大猫的无限游戏
Vercel News
Vercel News
H
Hackread – Cybersecurity News, Data Breaches, AI and More
WordPress大学
WordPress大学
The GitHub Blog
The GitHub Blog
Recent Announcements
Recent Announcements
腾讯CDC
MyScale Blog
MyScale Blog
V
Visual Studio Blog
The Cloudflare Blog
Microsoft Security Blog
Microsoft Security Blog
A
About on SuperTechFans
Google DeepMind News
Google DeepMind News
Last Week in AI
Last Week in AI
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻

博客园 - luckylou

Vuex和Pinia css3 transform scale 和 translate 不同步 translate 放前面 给nodejs分配内存 CSS Transition通过改变Height实现展开收起元素 JS中?? 与 || 的区别 error:03000086:digital envelope routines::initialization error antdesign vue3 a-input-search 清空 css 重置focus样式 sass 中使用/deep/报错(已解决) Object.entries() 凡事有度,过则为灾 h5 判断嵌入微信小程序页面 HTML5页面仅允许拍照 html2canvas 下载图片 anvas保存图片时,谷歌浏览器Chrome报错【解决方案】Not allowed to navigate top frame to data URL append节点原节点消失 clone js 根据 location 获取query string 参数 Easyui常用按钮图标汇总 微信小程序代码提交发布之后,必须删除原来的小程序才会更新到最新的代码
vue 图片旋转
luckylou · 2024-06-14 · via 博客园 - luckylou
<template>
  <div>
    <img :style="imageStyle" src="path/to/your/image.jpg" alt="Rotated Image">
    <button @click="rotateImage">Rotate Image</button>
  </div>
</template>
 
<script>
export default {
  data() {
    return {
      rotation: 0, // 旋转的角度
    };
  },
  computed: {
    imageStyle() {
      return {
        transform: `rotate(${this.rotation}deg)`,
      };
    },
  },
  methods: {
    rotateImage() {
      this.rotation += 90; // 每次点击旋转90度
    },
  },
};
</script>

posted @ 2024-06-14 17:29  luckylou  阅读(103)  评论(0)    收藏  举报