import{e as a,o as t,G as n}from"./vendor.d721e0a0.js";const p={class:"markdown-body"},l=n(`

Progress \u8FDB\u5EA6\u6761

\u4ECB\u7ECD

\u5C55\u793A\u64CD\u4F5C\u6216\u4EFB\u52A1\u7684\u5F53\u524D\u8FDB\u5EA6\uFF0C\u6BD4\u5982\u4E0A\u4F20\u6587\u4EF6\u3002

\u5B89\u88C5

import { createApp } from 'vue';
//vue
import { Progress,Icon } from '@nutui/nutui';
//taro
import { Progress,Icon } from '@nutui/nutui-taro';

const app = createApp();
app.use(Progress);
app.use(Icon);

\u57FA\u7840\u7528\u6CD5

<nut-progress percentage="30"></nut-progress>

\u8BBE\u7F6E\u9AD8\u5EA6\u548C\u989C\u8272

<nut-progress percentage="30" stroke-color="pink" stroke-width="20"></nut-progress>

\u8BBE\u7F6E\u767E\u5206\u6BD4\u4E0D\u663E\u793A

<nut-progress percentage="50" :show-text="false"></nut-progress>

\u8BBE\u7F6E\u767E\u5206\u6BD4\u5916\u663E

<nut-progress percentage="60" :text-inside="false" stroke-height="24"></nut-progress>

\u8BBE\u7F6E\u767E\u5206\u6BD4\u5185\u663E

<nut-progress percentage="60" :text-inside="true" stroke-width="24"></nut-progress>

\u81EA\u5B9A\u4E49\u5C3A\u5BF8

\u5185\u7F6E small\uFF0Cbase\uFF0Clarge \u4E09\u79CD\u89C4\u683C\u4F9B\u4F7F\u7528\u3002

<nut-progress size="small" percentage="30" text-inside="true" ></nut-progress>
<nut-progress size="base" percentage="50" text-inside="true"></nut-progress>
<nut-progress size="large" percentage="70"  text-inside="true"></nut-progress>

\u8BBE\u7F6E\u72B6\u6001\u663E\u793A

//\u52A8\u6001\u5C55\u793A
<nut-progress 
   percentage="30" 
   stroke-color="linear-gradient(270deg, rgba(18,126,255,1) 0%,rgba(32,147,255,1) 32.815625%,rgba(13,242,204,1) 100%)" 
   status="active">
</nut-progress>
// \u5C55\u793Aicon
<nut-progress percentage="50" stroke-color="#f30" stroke-width="15" ></nut-progress>
<nut-progress percentage="100" stroke-color="#1890ff" stroke-width="15" status="success"></nut-progress>

Prop

\u5B57\u6BB5	\u8BF4\u660E	\u7C7B\u578B	\u9ED8\u8BA4\u503C
percentage	\u767E\u5206\u6BD4	Number	0
stroke-color	\u8FDB\u5EA6\u6761\u80CC\u666F\u8272	String	#f30
stroke-width	\u8FDB\u5EA6\u6761\u5BBD\u5EA6	String	\u2018\u2019
size	\u8FDB\u5EA6\u6761\u53CA\u6587\u5B57\u5C3A\u5BF8\uFF0C\u53EF\u9009\u503Csmall/base/large	String	-
show-text	\u662F\u5426\u663E\u793A\u8FDB\u5EA6\u6761\u6587\u5B57\u5185\u5BB9	Boolean	true
text-inside	\u8FDB\u5EA6\u6761\u6587\u5B57\u663E\u793A\u4F4D\u7F6E(false:\u5916\u663E\uFF0Ctrue:\u5185\u663E)	Boolean	false
text-color	\u8FDB\u5EA6\u6761\u6587\u5B57\u989C\u8272\u8BBE\u7F6E	String	#333
status	\u8FDB\u5EA6\u6761\u5F53\u524D\u72B6\u6001,active(\u5C55\u793A\u52A8\u753B\u6548\u679C)/icon(\u5C55\u793Aicon\u6807\u7B7E)	String	text
icon-name	icon\u540D\u79F0	String	checked
icon-color	icon\u989C\u8272	String	#439422

`,22),r=[l],d={setup(e,{expose:s}){return s({frontmatter:{}}),(o,h)=>(t(),a("div",p,r))}};export{d as default};