图片（Image）
生成图片的模块。
概述
对于随机图片，请使用 {{$image.url}}。这不会直接返回图片，而是一个指向两个演示图片提供商“Picsum”和“LoremFlickr”之一的图片的 URL。你可以使用 {{$image.urlLoremFlickr}} 或 {{$image.urlPicsumPhotos}} 专门从两个提供商之一请求图片。
对于仅包含纯色和文本的随机占位符图片，请使用 {{$image.urlPlaceholder}}（使用第三方服务）或 {{$image.dataUri}}（返回 SVG 字符串）。
对于随机用户头像图片，请使用 {{$image.avatar}}。
此模块以前还包含用于生成特定主题图片的方法，例如“时尚”或“食物”，但这些方法现已弃用。如果你需要对图片类型进行更多控制，可以使用 {{$image.urlLoremFlickr}} 请求分类图片，直接使用图片提供商或提供你自己的占位符图片集。
avatar
生成一个随机的头像图片 URL。
返回: 字符串
示例
{{$image.avatar}} // 'https://cloudflare-ipfs.com/ipfs/Qmd3W5DuhgHirLHGVixi6V76LhCkZUz6pnFt5AJBiyvHye/avatar/65.jpg'
avatarGitHub
从 GitHub 生成一个随机的头像。
返回: 字符串
示例
{{$image.avatarGitHub}} // 'https://avatars.githubusercontent.com/u/30238607'
avatarLegacy
从 https://cloudflare-ipfs.com/ipfs/Qmd3W5DuhgHirLHGVixi6V76LhCkZUz6pnFt5AJBiyvHye/avatar 生成一个随机的头像。
返回: 字符串
示例
{{$image.avatarLegacy}} // 'https://cloudflare-ipfs.com/ipfs/Qmd3W5DuhgHirLHGVixi6V76LhCkZUz6pnFt5AJBiyvHye/avatar/386.jpg'
dataUri
生成一个随机的数据 URI，其中包含 URL 编码的 SVG 图片或 Base64 编码的 SVG 图片。
参数
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| color | 字符串 | {{$color.rgb}} | 图片的颜色。必须是 SVG 支持的颜色。 |
| height | 数字 | {{$number.int(min=1,max=3999)}} | 图片的高度。 |
| type | 'svg-uri' | 'svg-base64' | {{$helpers.arrayElements(['svg-uri','svg-base64'])}} | 图片的宽度。 |
| width | 数字 | {{$number.int(min=1,max=3999)}} | 图片的宽度。 |
返回: 字符串
示例
{{$image.dataUri}} // 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgYmFzZVByb2ZpbGU9ImZ1bGwiIHdpZHRoPSIxNTE1IiBoZWlnaHQ9IjM1MCI+PHJlY3Qgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgZmlsbD0iIzliYmU5YiIvPjx0ZXh0IHg9Ijc1Ny41IiB5PSIxNzUiIGZvbnQtc2l6ZT0iMjAiIGFsaWdubWVudC1iYXNlbGluZT0ibWlkZGxlIiB0ZXh0LWFuY2hvcj0ibWlkZGxlIiBmaWxsPSJ3aGl0ZSI+MTUxNXgzNTA8L3RleHQ+PC9zdmc+'
{{$image.dataUri(type='svg-base64')}} // 'data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZlcnNpb249IjEuMSIgYmFzZVByb2ZpbGU9ImZ1bGwiIHdpZHRoPSIyMDMxIiBoZWlnaHQ9IjI4ODAiPjxyZWN0IHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9IiNkNDM5YTIiLz48dGV4dCB4PSIxMDE1LjUiIHk9IjE0NDAiIGZvbnQtc2l6ZT0iMjAiIGFsaWdubWVudC1iYXNlbGluZT0ibWlkZGxlIiB0ZXh0LWFuY2hvcj0ibWlkZGxlIiBmaWxsPSJ3aGl0ZSI+MjAzMXgyODgwPC90ZXh0Pjwvc3ZnPg=='
url
生成一个随机的图片 URL。
参数
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| height | 数字 | {{$number.int(min=1,max=3999)}} | 图片的高度。 |
| width | 数字 | {{$number.int(min=1,max=3999)}} | 图片的宽度。 |
返回: 字符串
示例
{{$image.url}} // 'https://picsum.photos/seed/nJK2R/2332/2694'
urlLoremFlickr
通过 https://loremflickr.com 生成一个随机的图片 URL。
参数
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| category | 字符串 | 要用于图片的类别。 | |
| height | 数字 | {{$number.int(min=1,max=3999)}} | 图片的高度。 |
| width | 数字 | {{$number.int(min=1,max=3999)}} | 图片的宽度。 |
返回: 字符串
示例
{{$image.urlLoremFlickr}} // 'https://loremflickr.com/11/794?lock=4460902446123441'
{{$image.urlLoremFlickr(width=128)}} // 'https://loremflickr.com/128/1314?lock=569187007940822'
{{$image.urlLoremFlickr(height=128)}} // 'https://loremflickr.com/2575/128?lock=7327202370111549'
{{$image.urlLoremFlickr(category='nature')}} // 'https://loremflickr.com/1911/126/nature?lock=2207830818001848'
urlPicsumPhotos
通过 https://picsum.photos 生成一个随机的图片 URL。
参数
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| blur | 0 | 10 | 2 | 1 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | {{$number.int(max=10)}} | 图片是否应该模糊。0 禁用模糊。 |
| grayscale | 布尔值 | {{$datatype.boolean}} | 图片是否应该为灰度。 |
| height | 数字 | {{$number.int(min=1,max=3999)}} | 图片的高度。 |
| width | 数字 | {{$number.int(min=1,max=3999)}} | 图片的宽度。 |
返回: 字符串
示例
{{$image.urlPicsumPhotos}} // 'https://picsum.photos/seed/eOBLomQ1/1855/2500?blur=4'
{{$image.urlPicsumPhotos(width=128)}} // 'https://picsum.photos/seed/bCbuNt3B6U/128/2821?grayscale&blur=4'
{{$image.urlPicsumPhotos(height=128)}} // 'https://picsum.photos/seed/XJ2rBGY/184/128?blur=7'
{{$image.urlPicsumPhotos(grayscale=true)}} // 'https://picsum.photos/seed/kPftIofTd/1752/3352?grayscale&blur=8'
{{$image.urlPicsumPhotos(grayscale=true,blur=4)}} / 'https://picsum.photos/seed/7FxoLqG/48/412?grayscale&blur=4'
{{$image.urlPicsumPhotos(blur=4)}} //. 'https://picsum.photos/seed/DNM5Ncdzk/388/538?blur=4'
urlPlaceholder
通过 https://via.placeholder.com/ 生成一个随机的图片 URL。
参数
| 名称 | 类型 | 默认值 | 描述 |
|---|---|---|---|
| backgroundColor | 字符串 | {{$color.rgb(prefix=' ',format='hex')}} | 图片的背景色。 |
| format | 'gif' | 'jpeg' | 'jpg' | 'png' | 'webp' | {{$helpers.arrayElement(['gif','jpeg','jpg','png','webp'])}} | 图片的格式。 |
| height | 数字 | {{$number.int(min=1,max=3999)}} | 图片的高度。 |
| text | 数字 | {{$color.rgb(prefix=' ',format='hex')}} | 要在图片上显示的文本。 |
| textColor | 字符串 | {{$number.int(min=1,max=3999)}} | 图片的文本颜色。 |
| width | 数字 | {{$number.int(min=1,max=3999)}} | 图片的宽度。 |
返回: 字符串
示例
{{$image.urlPlaceholder}} // 'https://via.placeholder.com/1168x536/7dd5df/b705ad.jpeg?text=umquam%20adsum%20sit'
{{$image.urlPlaceholder(width=128)}} // 'https://via.placeholder.com/128x1123/9fcd41/a28509.png?text=sodalitas%20audeo%20causa'
{{$image.urlPlaceholder(height=128)}} // 'https://via.placeholder.com/210x128/429e9c/34de09.png?text=suasoria%20paens%20toties'
{{$image.urlPlaceholder(backgroundColor='000000')}} // 'https://via.placeholder.com/1719x1836/000000/aea69b.jpg?text=cibo%20coaegresco%20deludo'
{{$image.urlPlaceholder(textColor='000000')}} // 'https://via.placeholder.com/769x743/68aa4c/000000.png?text=perspiciatis%20cubicularis%20libero'
{{$image.urlPlaceholder(format='png')}} // 'https://via.placeholder.com/883x687/7cfe8b/8390a0.png?text=porro%20tantillus%20curto'
{{$image.urlPlaceholder(text='lorem ipsum')}} // 'https://via.placeholder.com/1497x1095/4b7dd6/71cdf4.png?text=lorem%20ipsum'
{{$image.urlPlaceholder(width=128,height=128,backgroundColor='000000',textColor='000000',format='png',text='lorem ipsum')}} // 'https://via.placeholder.com/128x128/000000/000000.png?text=lorem%20ipsum'