mirror of
https://gitee.com/wot-design-uni/wot-design-uni.git
synced 2025-12-07 01:28:30 +08:00
feat: ✨ img组件的mode属性增加类型ImageMode
mode有了类型后就不需要再去赋值mode了,直接类型提示+回车
This commit is contained in:
parent
e6a3b73142
commit
139898209f
@ -78,7 +78,7 @@ mode为小程序原生属性,参考[微信小程序image官方文档](https://
|
|||||||
| src | 图片链接 | string | - | - | - |
|
| src | 图片链接 | string | - | - | - |
|
||||||
| width | 宽度,默认单位为px | number / string | - | - | - |
|
| width | 宽度,默认单位为px | number / string | - | - | - |
|
||||||
| height | 高度,默认单位为px | number / string | - | - | - |
|
| height | 高度,默认单位为px | number / string | - | - | - |
|
||||||
| mode | 填充模式 | string | 'top left' / 'top right' / 'bottom left' / 'bottom right' / 'right' / 'left' / 'center' / 'bottom' / 'top' / 'heightFix' / 'widthFix' / 'aspectFill' / 'aspectFit' / 'scaleToFill' | 'scaleToFill' | - |
|
| mode | 填充模式 | ImageMode | 'top left' / 'top right' / 'bottom left' / 'bottom right' / 'right' / 'left' / 'center' / 'bottom' / 'top' / 'heightFix' / 'widthFix' / 'aspectFill' / 'aspectFit' / 'scaleToFill' | 'scaleToFill' | - |
|
||||||
| round | 是否显示为圆形 | boolean | - | false | - |
|
| round | 是否显示为圆形 | boolean | - | false | - |
|
||||||
| radius | 圆角大小,默认单位为px | number / string | - | - | - |
|
| radius | 圆角大小,默认单位为px | number / string | - | - | - |
|
||||||
| enable-preview | 是否支持点击预览 | boolean | - | false | - |
|
| enable-preview | 是否支持点击预览 | boolean | - | false | - |
|
||||||
|
|||||||
@ -41,7 +41,9 @@
|
|||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { joy } from '../images/joy'
|
import { joy } from '../images/joy'
|
||||||
import img from '../images/jd.png'
|
import img from '../images/jd.png'
|
||||||
const modes = [
|
import type { ImageMode } from '@/uni_modules/wot-design-uni/components/wd-img/types'
|
||||||
|
|
||||||
|
const modes: ImageMode[] = [
|
||||||
'top left',
|
'top left',
|
||||||
'top right',
|
'top right',
|
||||||
'bottom left',
|
'bottom left',
|
||||||
|
|||||||
@ -1,4 +1,19 @@
|
|||||||
import { baseProps, makeBooleanProp, makeStringProp, numericProp } from '../common/props'
|
import { baseProps, makeBooleanProp, makeStringProp, numericProp } from '../common/props'
|
||||||
|
export type ImageMode =
|
||||||
|
| 'scaleToFill'
|
||||||
|
| 'aspectFit'
|
||||||
|
| 'aspectFill'
|
||||||
|
| 'widthFix'
|
||||||
|
| 'heightFix'
|
||||||
|
| 'top'
|
||||||
|
| 'bottom'
|
||||||
|
| 'center'
|
||||||
|
| 'left'
|
||||||
|
| 'right'
|
||||||
|
| 'top left'
|
||||||
|
| 'top right'
|
||||||
|
| 'bottom left'
|
||||||
|
| 'bottom right'
|
||||||
|
|
||||||
export const imgProps = {
|
export const imgProps = {
|
||||||
...baseProps,
|
...baseProps,
|
||||||
@ -14,7 +29,7 @@ export const imgProps = {
|
|||||||
/**
|
/**
|
||||||
* 填充模式:'top left' / 'top right' / 'bottom left' / 'bottom right' / 'right' / 'left' / 'center' / 'bottom' / 'top' / 'heightFix' / 'widthFix' / 'aspectFill' / 'aspectFit' / 'scaleToFill'
|
* 填充模式:'top left' / 'top right' / 'bottom left' / 'bottom right' / 'right' / 'left' / 'center' / 'bottom' / 'top' / 'heightFix' / 'widthFix' / 'aspectFill' / 'aspectFit' / 'scaleToFill'
|
||||||
*/
|
*/
|
||||||
mode: makeStringProp('scaleToFill'),
|
mode: makeStringProp<ImageMode>('scaleToFill'),
|
||||||
/**
|
/**
|
||||||
* 是否懒加载
|
* 是否懒加载
|
||||||
*/
|
*/
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user