feat: 头像裁剪 AvatarCropper 支持裁剪圆形 #2818
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Codecov ReportAll modified and coverable lines are covered by tests ✅
Additional details and impacted files@@ Coverage Diff @@
## v4 #2818 +/- ##
=======================================
Coverage 84.98% 84.98%
=======================================
Files 166 166
Lines 21233 21238 +5
Branches 2418 2419 +1
=======================================
+ Hits 18044 18049 +5
Misses 3172 3172
Partials 17 17 ☔ View full report in Codecov by Sentry. |
|
我是这样理解的： 头像的上传、存储都是完整的正方形图片，只是在前端展示时可以显示成圆形、方形。 所以 PR 里新增的 canvas 相关的处理逻辑应该不需要了。仅仅是遮罩调整为圆形、裁剪之后的图片展示调整为圆形（比如使用 avatar 自带的圆形功能），样式上的改动。 |
ok 了解 |
eiinu
reviewed
Jan 3, 2024
| @@ -80,6 +80,10 @@ export default create({ | |||
| confirmText: { | |||
| type: String, | |||
| default: '确定' | |||
| }, | |||
| cutShape: { | |||
There was a problem hiding this comment.
新增属性名称改为 shape 即可，它的类型名称为 组件名+属性名，即 AvatarCropperShape.
There was a problem hiding this comment.
有这样一个问题：nut-avatar-cropper 样式上有一个灰色遮盖层，是 after 伪元素，无法动态修改为圆形
There was a problem hiding this comment.
你可参考react版本更改，我在react里面更改了一版，jdf2e/nutui-react#1842
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
这个 PR 做了什么? (简要描述所做更改)
resolve #2810
这个 PR 是什么类型? (至少选择一个)
这个 PR 涉及以下平台:
这个 PR 是否已自测: