search

xyxiao001 / vue-cropper

A simple picture clipping plugin for vue
https://github.xyxiao.cn/vue-cropper/docs/vue3.html
MIT License
4.34k stars 704 forks source link

能否添加设置mode(图片默认渲染方式)方法？ #830

Closed zlecheng closed 5 months ago

zlecheng commented 5 months ago

我的业务需要在清空框选的时候把图片的渲染方式再改回到 cover 的模式

xyxiao001 commented 5 months ago

可以直接通过props 修改mode就行了

zlecheng commented 5 months ago

可以直接通过props 修改mode就行了

直接改可以生效吗？

xyxiao001 commented 5 months ago

直接改 就会自动重新渲染了

zlecheng commented 5 months ago

直接改 就会自动重新渲染了

image image

似乎没有生效

zlecheng commented 5 months ago

直接改 就会自动重新渲染了

image

xyxiao001 commented 5 months ago

https://github.xyxiao.cn/vue-cropper/docs/vue3.html 可以看看例子，就是直接通过prop更改mode的

zlecheng commented 5 months ago

https://github.xyxiao.cn/vue-cropper/docs/vue3.html 可以看看例子，就是直接通过prop更改mode的

image

你用的是刷新的方法

xyxiao001 commented 5 months ago

这是刷新截图框 ，mode是改变传入就会渲染的

zlecheng commented 5 months ago

但是我的没变

---- 回复的原邮件 ---- | 发件人 | @.> | | 日期 | 2024年06月05日 21:14 | | 收件人 | @.> | | 抄送至 | @.>@.> | | 主题 | Re: [xyxiao001/vue-cropper] 能否添加设置mode(图片默认渲染方式)方法？ (Issue #830) |

这是刷新截图框 ，mode是改变传入就会渲染的

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

xyxiao001 commented 5 months ago

https://jsbin.com/jivoyewaco/edit?html,css,output 看看这个例子，什么都没改变，只改了传入的props mode的值

xyxiao001 commented 5 months ago

20240605212531_rec_

xyxiao001 commented 5 months ago

watch是要mode值发生改变才会重新渲染

xyxiao001 commented 5 months ago

你如果只想重新渲染可以执行reload方法

zlecheng commented 5 months ago

你如果只想重新渲染可以执行reload方法

image 用按钮点击改变mode就不行了

zlecheng commented 5 months ago

你如果只想重新渲染可以执行reload方法

用reload方法没办法把选区清空，只会把图片还原成初始的尺寸

xyxiao001 commented 5 months ago

https://jsbin.com/moluquvizi/edit?html,css,js,console,output 怎么可能出现按钮点击就不行呢，这是watch监听的，除非mode没变 20240606093001_rec_

xyxiao001 commented 5 months ago

reload没办法清空截图框，是因为你设置了自动生成截图框，可以吧autoCrop那几个值设置为false，然后reload截图框就没了

zlecheng commented 5 months ago

https://jsbin.com/moluquvizi/edit?html,css,js,console,output 怎么可能出现按钮点击就不行呢，这是watch监听的，除非mode没变 20240606093001_rec_ [ ![20240606093001rec](https://private-user-images.githubusercontent.com/15681693/337068878-e2cf63cf-c869-4cfc-b6e1-dc71f457bff3.gif

为啥我的vue3就不行呢，打印的mode值已经变了 image image