import{d as A,r as i,_ as b,l as h,w as c,j as p,k as d,b as n,f as e,e as a,c as W,z as f,a as I,t as v,F as w,q as B}from"./index.3fe853a6.js";import{F as H}from"./FrownOutlined.f0d942d8.js";import{S as Y}from"./SmileOutlined.02787c93.js";const P=A({setup(){const t=i(0),s=i([20,50]),k=i(!1);return{value1:t,value2:s,disabled:k}}});function D(t,s,k,g,C,m){const l=p("a-slider"),r=p("a-switch"),o=p("demo-box");return d(),h(o,{jsfiddle:{us:"Basic slider. When `range` is `true`, display as dual thumb mode. When `disable` is `true`, the slider will not be interactable.",cn:"\u57FA\u672C\u6ED1\u52A8\u6761\u3002\u5F53 `range` \u4E3A `true` \u65F6\uFF0C\u6E32\u67D3\u4E3A\u53CC\u6ED1\u5757\u3002\u5F53 `disabled` \u4E3A `true` \u65F6\uFF0C\u6ED1\u5757\u5904\u4E8E\u4E0D\u53EF\u7528\u72B6\u6001\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u57FA\u672C\u6ED1\u52A8\u6761\u3002\u5F53 <code>range</code> \u4E3A <code>true</code> \u65F6\uFF0C\u6E32\u67D3\u4E3A\u53CC\u6ED1\u5757\u3002\u5F53 <code>disabled</code> \u4E3A <code>true</code> \u65F6\uFF0C\u6ED1\u5757\u5904\u4E8E\u4E0D\u53EF\u7528\u72B6\u6001\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Basic slider. When <code>range</code> is <code>true</code>, display as dual thumb mode. When <code>disable</code> is <code>true</code>, the slider will not be interactable.</p>
`,order:0,title:{"zh-CN":"\u57FA\u672C","en-US":"Basic"},relativePath:"components/slider/demo/basic.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1zbGlkZXIgaWQ9InRlc3QiIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIgOmRpc2FibGVkPSJkaXNhYmxlZCIgLz4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIHJhbmdlIDpkaXNhYmxlZD0iZGlzYWJsZWQiIC8+CiAgICBEaXNhYmxlZDoKICAgIDxhLXN3aXRjaCB2LW1vZGVsOmNoZWNrZWQ9ImRpc2FibGVkIiBzaXplPSJzbWFsbCIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZTEgPSByZWY8bnVtYmVyPigwKTsKICAgIGNvbnN0IHZhbHVlMiA9IHJlZjxbbnVtYmVyLCBudW1iZXJdPihbMjAsIDUwXSk7CiAgICBjb25zdCBkaXNhYmxlZCA9IHJlZjxib29sZWFuPihmYWxzZSk7CgogICAgcmV0dXJuIHsKICAgICAgdmFsdWUxLAogICAgICB2YWx1ZTIsCiAgICAgIGRpc2FibGVkLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5jb2RlLWJveC1kZW1vIC5hbnQtc2xpZGVyIHsKICBtYXJnaW4tYm90dG9tOiAxNnB4Owp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1zbGlkZXIgaWQ9InRlc3QiIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIgOmRpc2FibGVkPSJkaXNhYmxlZCIgLz4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIHJhbmdlIDpkaXNhYmxlZD0iZGlzYWJsZWQiIC8+CiAgICBEaXNhYmxlZDoKICAgIDxhLXN3aXRjaCB2LW1vZGVsOmNoZWNrZWQ9ImRpc2FibGVkIiBzaXplPSJzbWFsbCIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUxID0gcmVmKDApOwogICAgY29uc3QgdmFsdWUyID0gcmVmKFsyMCwgNTBdKTsKICAgIGNvbnN0IGRpc2FibGVkID0gcmVmKGZhbHNlKTsKICAgIHJldHVybiB7CiAgICAgIHZhbHVlMSwKICAgICAgdmFsdWUyLAogICAgICBkaXNhYmxlZCwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pgo8c3R5bGUgc2NvcGVkPgouY29kZS1ib3gtZGVtbyAuYW50LXNsaWRlciB7CiAgbWFyZ2luLWJvdHRvbTogMTZweDsKfQo8L3N0eWxlPg=="}},{default:c(()=>[n("div",null,[e(l,{id:"test",value:t.value1,"onUpdate:value":s[0]||(s[0]=u=>t.value1=u),disabled:t.disabled},null,8,["value","disabled"]),e(l,{value:t.value2,"onUpdate:value":s[1]||(s[1]=u=>t.value2=u),range:"",disabled:t.disabled},null,8,["value","disabled"]),s[3]||(s[3]=a(" Disabled: ")),e(r,{checked:t.disabled,"onUpdate:checked":s[2]||(s[2]=u=>t.disabled=u),size:"small"},null,8,["checked"])])]),htmlCode:c(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("test"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":disabled"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":disabled"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    Disabled:
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"["),a("number"),n("span",{class:"token punctuation"},","),a(" number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" disabled "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      disabled`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[5]||(s[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("test"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":disabled"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":disabled"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    Disabled:
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("disabled"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" disabled "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      disabled`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const X=b(P,[["render",D],["__scopeId","data-v-ef71328c"]]),S=A({setup(){const t=i(0),s=i(1);return{inputValue:t,inputValue1:s}}});function N(t,s,k,g,C,m){const l=p("a-slider"),r=p("a-col"),o=p("a-input-number"),u=p("a-row"),Z=p("demo-box");return d(),h(Z,{jsfiddle:{us:"Synchronize with [InputNumber](/components/input-number/) component.",cn:"\u548C [\u6570\u5B57\u8F93\u5165\u6846](/components/input-number/) \u7EC4\u4EF6\u4FDD\u6301\u540C\u6B65\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u548C <a href="/components/input-number/">\u6570\u5B57\u8F93\u5165\u6846</a> \u7EC4\u4EF6\u4FDD\u6301\u540C\u6B65\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Synchronize with <a href="/components/input-number/">InputNumber</a> component.</p>
`,order:1,title:{"zh-CN":"\u5E26\u8F93\u5165\u6846\u7684\u6ED1\u5757","en-US":"Slider with InputNumber"},relativePath:"components/slider/demo/input-number.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1yb3c+CiAgICAgIDxhLWNvbCA6c3Bhbj0iMTIiPgogICAgICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJpbnB1dFZhbHVlMSIgOm1pbj0iMSIgOm1heD0iMjAiIC8+CiAgICAgIDwvYS1jb2w+CiAgICAgIDxhLWNvbCA6c3Bhbj0iNCI+CiAgICAgICAgPGEtaW5wdXQtbnVtYmVyIHYtbW9kZWw6dmFsdWU9ImlucHV0VmFsdWUxIiA6bWluPSIxIiA6bWF4PSIyMCIgc3R5bGU9Im1hcmdpbi1sZWZ0OiAxNnB4IiAvPgogICAgICA8L2EtY29sPgogICAgPC9hLXJvdz4KICAgIDxhLXJvdz4KICAgICAgPGEtY29sIDpzcGFuPSIxMiI+CiAgICAgICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9ImlucHV0VmFsdWUiIDptaW49IjAiIDptYXg9IjEiIDpzdGVwPSIwLjAxIiAvPgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjQiPgogICAgICAgIDxhLWlucHV0LW51bWJlcgogICAgICAgICAgdi1tb2RlbDp2YWx1ZT0iaW5wdXRWYWx1ZSIKICAgICAgICAgIDptaW49IjAiCiAgICAgICAgICA6bWF4PSIxIgogICAgICAgICAgOnN0ZXA9IjAuMDEiCiAgICAgICAgICBzdHlsZT0ibWFyZ2luLWxlZnQ6IDE2cHgiCiAgICAgICAgLz4KICAgICAgPC9hLWNvbD4KICAgIDwvYS1yb3c+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBpbnB1dFZhbHVlID0gcmVmPG51bWJlcj4oMCk7CiAgICBjb25zdCBpbnB1dFZhbHVlMSA9IHJlZjxudW1iZXI+KDEpOwogICAgcmV0dXJuIHsKICAgICAgaW5wdXRWYWx1ZSwKICAgICAgaW5wdXRWYWx1ZTEsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIHNjb3BlZD4KLmNvZGUtYm94LWRlbW8gLmFudC1zbGlkZXIgewogIG1hcmdpbi1ib3R0b206IDE2cHg7Cn0KPC9zdHlsZT4K",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1yb3c+CiAgICAgIDxhLWNvbCA6c3Bhbj0iMTIiPgogICAgICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJpbnB1dFZhbHVlMSIgOm1pbj0iMSIgOm1heD0iMjAiIC8+CiAgICAgIDwvYS1jb2w+CiAgICAgIDxhLWNvbCA6c3Bhbj0iNCI+CiAgICAgICAgPGEtaW5wdXQtbnVtYmVyIHYtbW9kZWw6dmFsdWU9ImlucHV0VmFsdWUxIiA6bWluPSIxIiA6bWF4PSIyMCIgc3R5bGU9Im1hcmdpbi1sZWZ0OiAxNnB4IiAvPgogICAgICA8L2EtY29sPgogICAgPC9hLXJvdz4KICAgIDxhLXJvdz4KICAgICAgPGEtY29sIDpzcGFuPSIxMiI+CiAgICAgICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9ImlucHV0VmFsdWUiIDptaW49IjAiIDptYXg9IjEiIDpzdGVwPSIwLjAxIiAvPgogICAgICA8L2EtY29sPgogICAgICA8YS1jb2wgOnNwYW49IjQiPgogICAgICAgIDxhLWlucHV0LW51bWJlcgogICAgICAgICAgdi1tb2RlbDp2YWx1ZT0iaW5wdXRWYWx1ZSIKICAgICAgICAgIDptaW49IjAiCiAgICAgICAgICA6bWF4PSIxIgogICAgICAgICAgOnN0ZXA9IjAuMDEiCiAgICAgICAgICBzdHlsZT0ibWFyZ2luLWxlZnQ6IDE2cHgiCiAgICAgICAgLz4KICAgICAgPC9hLWNvbD4KICAgIDwvYS1yb3c+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IGlucHV0VmFsdWUgPSByZWYoMCk7CiAgICBjb25zdCBpbnB1dFZhbHVlMSA9IHJlZigxKTsKICAgIHJldHVybiB7CiAgICAgIGlucHV0VmFsdWUsCiAgICAgIGlucHV0VmFsdWUxLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5jb2RlLWJveC1kZW1vIC5hbnQtc2xpZGVyIHsKICBtYXJnaW4tYm90dG9tOiAxNnB4Owp9Cjwvc3R5bGU+"}},{default:c(()=>[n("div",null,[e(u,null,{default:c(()=>[e(r,{span:12},{default:c(()=>[e(l,{value:t.inputValue1,"onUpdate:value":s[0]||(s[0]=y=>t.inputValue1=y),min:1,max:20},null,8,["value"])]),_:1}),e(r,{span:4},{default:c(()=>[e(o,{value:t.inputValue1,"onUpdate:value":s[1]||(s[1]=y=>t.inputValue1=y),min:1,max:20,style:{"margin-left":"16px"}},null,8,["value"])]),_:1})]),_:1}),e(u,null,{default:c(()=>[e(r,{span:12},{default:c(()=>[e(l,{value:t.inputValue,"onUpdate:value":s[2]||(s[2]=y=>t.inputValue=y),min:0,max:1,step:.01},null,8,["value"])]),_:1}),e(r,{span:4},{default:c(()=>[e(o,{value:t.inputValue,"onUpdate:value":s[3]||(s[3]=y=>t.inputValue=y),min:0,max:1,step:.01,style:{"margin-left":"16px"}},null,8,["value"])]),_:1})]),_:1})])]),htmlCode:c(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("12"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("20"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("4"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input-number")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("20"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("12"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0.01"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("4"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input-number")]),a(`
          `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0.01"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),a(`
        `),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" inputValue "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" inputValue1 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      inputValue`),n("span",{class:"token punctuation"},","),a(`
      inputValue1`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[5]||(s[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("12"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("20"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("4"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input-number")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("20"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("12"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0.01"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-col")]),a(),n("span",{class:"token attr-name"},":span"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("4"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-input-number")]),a(`
          `),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("inputValue"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("1"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0.01"),n("span",{class:"token punctuation"},'"')]),a(`
          `),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 16px")]),n("span",{class:"token punctuation"},'"')])]),a(`
        `),n("span",{class:"token punctuation"},"/>")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-col")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-row")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" inputValue "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" inputValue1 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"1"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      inputValue`),n("span",{class:"token punctuation"},","),a(`
      inputValue1`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const K=b(S,[["render",N],["__scopeId","data-v-4c263a7a"]]),z=A({components:{FrownOutlined:H,SmileOutlined:Y},setup(){const t=i(0),s=i(0),k=i(20),g=W(()=>{const m=+((k.value-s.value)/2).toFixed(5);return t.value>=m?"":"rgba(0, 0, 0, .45)"}),C=W(()=>{const m=+((k.value-s.value)/2).toFixed(5);return t.value>=m?"rgba(0, 0, 0, .45)":""});return{sliderValue:t,min:s,max:k,preColor:g,nextColor:C}}});const T={class:"icon-wrapper"};function R(t,s,k,g,C,m){const l=p("frown-outlined"),r=p("a-slider"),o=p("smile-outlined"),u=p("demo-box");return d(),h(u,{jsfiddle:{us:"You can add an icon beside the slider to make it meaningful.",cn:"\u6ED1\u5757\u5DE6\u53F3\u53EF\u4EE5\u8BBE\u7F6E\u56FE\u6807\u6765\u8868\u8FBE\u4E1A\u52A1\u542B\u4E49\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u6ED1\u5757\u5DE6\u53F3\u53EF\u4EE5\u8BBE\u7F6E\u56FE\u6807\u6765\u8868\u8FBE\u4E1A\u52A1\u542B\u4E49\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>You can add an icon beside the slider to make it meaningful.</p>
`,order:2,title:{"zh-CN":"\u5E26 icon \u7684\u6ED1\u5757","en-US":"Slider with icon"},relativePath:"components/slider/demo/icon-slider.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9Imljb24td3JhcHBlciI+CiAgICA8ZnJvd24tb3V0bGluZWQgOnN0eWxlPSJ7IGNvbG9yOiBwcmVDb2xvciB9IiAvPgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InNsaWRlclZhbHVlIiA6bWluPSIwIiA6bWF4PSIyMCIgLz4KICAgIDxzbWlsZS1vdXRsaW5lZCA6c3R5bGU9InsgY29sb3I6IG5leHRDb2xvciB9IiAvPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0IGxhbmc9InRzIj4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYsIGNvbXB1dGVkIH0gZnJvbSAndnVlJzsKaW1wb3J0IHsgRnJvd25PdXRsaW5lZCwgU21pbGVPdXRsaW5lZCB9IGZyb20gJ0BhbnQtZGVzaWduL2ljb25zLXZ1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgY29tcG9uZW50czogewogICAgRnJvd25PdXRsaW5lZCwKICAgIFNtaWxlT3V0bGluZWQsCiAgfSwKICBzZXR1cCgpIHsKICAgIGNvbnN0IHNsaWRlclZhbHVlID0gcmVmPG51bWJlcj4oMCk7CiAgICBjb25zdCBtaW4gPSByZWY8bnVtYmVyPigwKTsKICAgIGNvbnN0IG1heCA9IHJlZjxudW1iZXI+KDIwKTsKCiAgICBjb25zdCBwcmVDb2xvciA9IGNvbXB1dGVkKCgpID0+IHsKICAgICAgY29uc3QgbWlkID0gKygobWF4LnZhbHVlIC0gbWluLnZhbHVlKSAvIDIpLnRvRml4ZWQoNSk7CiAgICAgIHJldHVybiBzbGlkZXJWYWx1ZS52YWx1ZSA+PSBtaWQgPyAnJyA6ICdyZ2JhKDAsIDAsIDAsIC40NSknOwogICAgfSk7CgogICAgY29uc3QgbmV4dENvbG9yID0gY29tcHV0ZWQoKCkgPT4gewogICAgICBjb25zdCBtaWQgPSArKChtYXgudmFsdWUgLSBtaW4udmFsdWUpIC8gMikudG9GaXhlZCg1KTsKICAgICAgcmV0dXJuIHNsaWRlclZhbHVlLnZhbHVlID49IG1pZCA/ICdyZ2JhKDAsIDAsIDAsIC40NSknIDogJyc7CiAgICB9KTsKCiAgICByZXR1cm4gewogICAgICBzbGlkZXJWYWx1ZSwKICAgICAgbWluLAogICAgICBtYXgsCiAgICAgIHByZUNvbG9yLAogICAgICBuZXh0Q29sb3IsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIHNjb3BlZD4KLmljb24td3JhcHBlciB7CiAgcG9zaXRpb246IHJlbGF0aXZlOwogIHBhZGRpbmc6IDBweCAzMHB4Owp9CgouaWNvbi13cmFwcGVyIC5hbnRpY29uIHsKICBwb3NpdGlvbjogYWJzb2x1dGU7CiAgdG9wOiAtMnB4OwogIHdpZHRoOiAxNnB4OwogIGhlaWdodDogMTZweDsKICBsaW5lLWhlaWdodDogMTsKICBmb250LXNpemU6IDE2cHg7CiAgY29sb3I6IHJnYmEoMCwgMCwgMCwgMC4yNSk7Cn0KCi5pY29uLXdyYXBwZXIgLmFudGljb246Zmlyc3QtY2hpbGQgewogIGxlZnQ6IDA7Cn0KCi5pY29uLXdyYXBwZXIgLmFudGljb246bGFzdC1jaGlsZCB7CiAgcmlnaHQ6IDA7Cn0KPC9zdHlsZT4K",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9Imljb24td3JhcHBlciI+CiAgICA8ZnJvd24tb3V0bGluZWQgOnN0eWxlPSJ7IGNvbG9yOiBwcmVDb2xvciB9IiAvPgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InNsaWRlclZhbHVlIiA6bWluPSIwIiA6bWF4PSIyMCIgLz4KICAgIDxzbWlsZS1vdXRsaW5lZCA6c3R5bGU9InsgY29sb3I6IG5leHRDb2xvciB9IiAvPgogIDwvZGl2Pgo8L3RlbXBsYXRlPgo8c2NyaXB0PgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiwgY29tcHV0ZWQgfSBmcm9tICd2dWUnOwppbXBvcnQgeyBGcm93bk91dGxpbmVkLCBTbWlsZU91dGxpbmVkIH0gZnJvbSAnQGFudC1kZXNpZ24vaWNvbnMtdnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBjb21wb25lbnRzOiB7CiAgICBGcm93bk91dGxpbmVkLAogICAgU21pbGVPdXRsaW5lZCwKICB9LAogIHNldHVwKCkgewogICAgY29uc3Qgc2xpZGVyVmFsdWUgPSByZWYoMCk7CiAgICBjb25zdCBtaW4gPSByZWYoMCk7CiAgICBjb25zdCBtYXggPSByZWYoMjApOwogICAgY29uc3QgcHJlQ29sb3IgPSBjb21wdXRlZCgoKSA9PiB7CiAgICAgIGNvbnN0IG1pZCA9ICsoKG1heC52YWx1ZSAtIG1pbi52YWx1ZSkgLyAyKS50b0ZpeGVkKDUpOwogICAgICByZXR1cm4gc2xpZGVyVmFsdWUudmFsdWUgPj0gbWlkID8gJycgOiAncmdiYSgwLCAwLCAwLCAuNDUpJzsKICAgIH0pOwogICAgY29uc3QgbmV4dENvbG9yID0gY29tcHV0ZWQoKCkgPT4gewogICAgICBjb25zdCBtaWQgPSArKChtYXgudmFsdWUgLSBtaW4udmFsdWUpIC8gMikudG9GaXhlZCg1KTsKICAgICAgcmV0dXJuIHNsaWRlclZhbHVlLnZhbHVlID49IG1pZCA/ICdyZ2JhKDAsIDAsIDAsIC40NSknIDogJyc7CiAgICB9KTsKICAgIHJldHVybiB7CiAgICAgIHNsaWRlclZhbHVlLAogICAgICBtaW4sCiAgICAgIG1heCwKICAgICAgcHJlQ29sb3IsCiAgICAgIG5leHRDb2xvciwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pgo8c3R5bGUgc2NvcGVkPgouaWNvbi13cmFwcGVyIHsKICBwb3NpdGlvbjogcmVsYXRpdmU7CiAgcGFkZGluZzogMHB4IDMwcHg7Cn0KCi5pY29uLXdyYXBwZXIgLmFudGljb24gewogIHBvc2l0aW9uOiBhYnNvbHV0ZTsKICB0b3A6IC0ycHg7CiAgd2lkdGg6IDE2cHg7CiAgaGVpZ2h0OiAxNnB4OwogIGxpbmUtaGVpZ2h0OiAxOwogIGZvbnQtc2l6ZTogMTZweDsKICBjb2xvcjogcmdiYSgwLCAwLCAwLCAwLjI1KTsKfQoKLmljb24td3JhcHBlciAuYW50aWNvbjpmaXJzdC1jaGlsZCB7CiAgbGVmdDogMDsKfQoKLmljb24td3JhcHBlciAuYW50aWNvbjpsYXN0LWNoaWxkIHsKICByaWdodDogMDsKfQo8L3N0eWxlPg=="}},{default:c(()=>[n("div",T,[e(l,{style:f({color:t.preColor})},null,8,["style"]),e(r,{value:t.sliderValue,"onUpdate:value":s[0]||(s[0]=Z=>t.sliderValue=Z),min:0,max:20},null,8,["value"]),e(o,{style:f({color:t.nextColor})},null,8,["style"])])]),htmlCode:c(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("icon-wrapper"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("frown-outlined")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ color: preColor }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("sliderValue"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("20"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("smile-outlined")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ color: nextColor }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" computed "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" FrownOutlined"),n("span",{class:"token punctuation"},","),a(" SmileOutlined "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
    FrownOutlined`),n("span",{class:"token punctuation"},","),a(`
    SmileOutlined`),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" sliderValue "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" min "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" max "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(" preColor "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"const"),a(" mid "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"+"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),a("max"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"-"),a(" min"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"/"),a(),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toFixed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"5"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"return"),a(" sliderValue"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},">="),a(" mid "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"''"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'rgba(0, 0, 0, .45)'"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(" nextColor "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"const"),a(" mid "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"+"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),a("max"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"-"),a(" min"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"/"),a(),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toFixed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"5"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"return"),a(" sliderValue"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},">="),a(" mid "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'rgba(0, 0, 0, .45)'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      sliderValue`),n("span",{class:"token punctuation"},","),a(`
      min`),n("span",{class:"token punctuation"},","),a(`
      max`),n("span",{class:"token punctuation"},","),a(`
      preColor`),n("span",{class:"token punctuation"},","),a(`
      nextColor`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".icon-wrapper"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"position"),n("span",{class:"token punctuation"},":"),a(" relative"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 0px 30px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".icon-wrapper .anticon"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"position"),n("span",{class:"token punctuation"},":"),a(" absolute"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"top"),n("span",{class:"token punctuation"},":"),a(" -2px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"line-height"),n("span",{class:"token punctuation"},":"),a(" 1"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"color"),n("span",{class:"token punctuation"},":"),a(),n("span",{class:"token function"},"rgba"),n("span",{class:"token punctuation"},"("),a("0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0.25"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".icon-wrapper .anticon:first-child"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"left"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".icon-wrapper .anticon:last-child"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"right"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("icon-wrapper"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("frown-outlined")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ color: preColor }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("sliderValue"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":min"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("0"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":max"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("20"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("smile-outlined")]),a(),n("span",{class:"token attr-name"},":style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ color: nextColor }"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" computed "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" FrownOutlined"),n("span",{class:"token punctuation"},","),a(" SmileOutlined "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'@ant-design/icons-vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token literal-property property"},"components"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
    FrownOutlined`),n("span",{class:"token punctuation"},","),a(`
    SmileOutlined`),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" sliderValue "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" min "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"0"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" max "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" preColor "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"const"),a(" mid "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"+"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),a("max"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"-"),a(" min"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"/"),a(),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toFixed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"5"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"return"),a(" sliderValue"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},">="),a(" mid "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"''"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'rgba(0, 0, 0, .45)'"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" nextColor "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"computed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"const"),a(" mid "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token operator"},"+"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"("),a("max"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},"-"),a(" min"),n("span",{class:"token punctuation"},"."),a("value"),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"/"),a(),n("span",{class:"token number"},"2"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"toFixed"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"5"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
      `),n("span",{class:"token keyword"},"return"),a(" sliderValue"),n("span",{class:"token punctuation"},"."),a("value "),n("span",{class:"token operator"},">="),a(" mid "),n("span",{class:"token operator"},"?"),a(),n("span",{class:"token string"},"'rgba(0, 0, 0, .45)'"),a(),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"''"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      sliderValue`),n("span",{class:"token punctuation"},","),a(`
      min`),n("span",{class:"token punctuation"},","),a(`
      max`),n("span",{class:"token punctuation"},","),a(`
      preColor`),n("span",{class:"token punctuation"},","),a(`
      nextColor`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".icon-wrapper"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"position"),n("span",{class:"token punctuation"},":"),a(" relative"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"padding"),n("span",{class:"token punctuation"},":"),a(" 0px 30px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".icon-wrapper .anticon"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"position"),n("span",{class:"token punctuation"},":"),a(" absolute"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"top"),n("span",{class:"token punctuation"},":"),a(" -2px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"width"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"line-height"),n("span",{class:"token punctuation"},":"),a(" 1"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"font-size"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token property"},"color"),n("span",{class:"token punctuation"},":"),a(),n("span",{class:"token function"},"rgba"),n("span",{class:"token punctuation"},"("),a("0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0"),n("span",{class:"token punctuation"},","),a(" 0.25"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".icon-wrapper .anticon:first-child"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"left"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`

`),n("span",{class:"token selector"},".icon-wrapper .anticon:last-child"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"right"),n("span",{class:"token punctuation"},":"),a(" 0"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const j=b(z,[["render",R],["__scopeId","data-v-b4518258"]]),J=A({setup(){return{disabled:i(!1),formatter:k=>`${k}%`}}});function U(t,s,k,g,C,m){const l=p("a-slider"),r=p("demo-box");return d(),h(r,{jsfiddle:{us:"Use `tipFormatter` to format content of `Tooltip`. If `tipFormatter` is null, hide it.",cn:"\u4F7F\u7528 `tipFormatter` \u53EF\u4EE5\u683C\u5F0F\u5316 `Tooltip` \u7684\u5185\u5BB9\uFF0C\u8BBE\u7F6E `tipFormatter={null}`\uFF0C\u5219\u9690\u85CF `Tooltip`\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u4F7F\u7528 <code>tipFormatter</code> \u53EF\u4EE5\u683C\u5F0F\u5316 <code>Tooltip</code> \u7684\u5185\u5BB9\uFF0C\u8BBE\u7F6E <code>tipFormatter={null}</code>\uFF0C\u5219\u9690\u85CF <code>Tooltip</code>\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Use <code>tipFormatter</code> to format content of <code>Tooltip</code>. If <code>tipFormatter</code> is null, hide it.</p>
`,order:3,title:{"zh-CN":"\u81EA\u5B9A\u4E49\u63D0\u793A","en-US":"Customize tooltip"},relativePath:"components/slider/demo/tip-formatter.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1zbGlkZXIgOnRpcC1mb3JtYXR0ZXI9ImZvcm1hdHRlciIgLz4KICAgIDxhLXNsaWRlciA6dGlwLWZvcm1hdHRlcj0ibnVsbCIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCBkaXNhYmxlZCA9IHJlZjxib29sZWFuPihmYWxzZSk7CiAgICBjb25zdCBmb3JtYXR0ZXIgPSAodmFsdWU6IG51bWJlcikgPT4gewogICAgICByZXR1cm4gYCR7dmFsdWV9JWA7CiAgICB9OwoKICAgIHJldHVybiB7CiAgICAgIGRpc2FibGVkLAogICAgICBmb3JtYXR0ZXIsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KCg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1zbGlkZXIgOnRpcC1mb3JtYXR0ZXI9ImZvcm1hdHRlciIgLz4KICAgIDxhLXNsaWRlciA6dGlwLWZvcm1hdHRlcj0ibnVsbCIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgZGlzYWJsZWQgPSByZWYoZmFsc2UpOwogICAgY29uc3QgZm9ybWF0dGVyID0gdmFsdWUgPT4gewogICAgICByZXR1cm4gYCR7dmFsdWV9JWA7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgZGlzYWJsZWQsCiAgICAgIGZvcm1hdHRlciwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0Pg=="}},{default:c(()=>[n("div",null,[e(l,{"tip-formatter":t.formatter},null,8,["tip-formatter"]),e(l,{"tip-formatter":null})])]),htmlCode:c(()=>s[0]||(s[0]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},":tip-formatter"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("formatter"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},":tip-formatter"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("null"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" disabled "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"formatter"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(" number")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"%"),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      disabled`),n("span",{class:"token punctuation"},","),a(`
      formatter`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},":tip-formatter"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("formatter"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},":tip-formatter"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("null"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" disabled "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"false"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"formatter"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"value"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token template-string"},[n("span",{class:"token template-punctuation string"},"`"),n("span",{class:"token interpolation"},[n("span",{class:"token interpolation-punctuation punctuation"},"${"),a("value"),n("span",{class:"token interpolation-punctuation punctuation"},"}")]),n("span",{class:"token string"},"%"),n("span",{class:"token template-punctuation string"},"`")]),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      disabled`),n("span",{class:"token punctuation"},","),a(`
      formatter`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const L=b(J,[["render",U]]),E=A({setup(){const t=i(30),s=i([20,50]);return{value1:t,value2:s,onAfterChange:g=>{console.log("afterChange: ",g)}}}});const M={class:"code-box-demo"};function q(t,s,k,g,C,m){const l=p("a-slider"),r=p("demo-box");return d(),h(r,{jsfiddle:{us:"The `onChange` callback function will fire when the user changes the slider's value. The `onAfterChange` callback function will fire when `onmouseup` fired.",cn:"\u5F53 Slider \u7684\u503C\u53D1\u751F\u6539\u53D8\u65F6\uFF0C\u4F1A\u89E6\u53D1 `onChange` \u4E8B\u4EF6\uFF0C\u5E76\u628A\u6539\u53D8\u540E\u7684\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002\u5728 `onmouseup` \u65F6\uFF0C\u4F1A\u89E6\u53D1 `onAfterChange` \u4E8B\u4EF6\uFF0C\u5E76\u628A\u5F53\u524D\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5F53 Slider \u7684\u503C\u53D1\u751F\u6539\u53D8\u65F6\uFF0C\u4F1A\u89E6\u53D1 <code>onChange</code> \u4E8B\u4EF6\uFF0C\u5E76\u628A\u6539\u53D8\u540E\u7684\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002\u5728 <code>onmouseup</code> \u65F6\uFF0C\u4F1A\u89E6\u53D1 <code>onAfterChange</code> \u4E8B\u4EF6\uFF0C\u5E76\u628A\u5F53\u524D\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>The <code>onChange</code> callback function will fire when the user changes the slider's value. The <code>onAfterChange</code> callback function will fire when <code>onmouseup</code> fired.</p>
`,order:4,title:{"zh-CN":"\u4E8B\u4EF6","en-US":"Event"},relativePath:"components/slider/demo/event.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImNvZGUtYm94LWRlbW8iPgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIgQGFmdGVyQ2hhbmdlPSJvbkFmdGVyQ2hhbmdlIiAvPgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InZhbHVlMiIgcmFuZ2UgOnN0ZXA9IjEwIiBAYWZ0ZXJDaGFuZ2U9Im9uQWZ0ZXJDaGFuZ2UiIC8+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiB9IGZyb20gJ3Z1ZSc7CgpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUxID0gcmVmPG51bWJlcj4oMzApOwogICAgY29uc3QgdmFsdWUyID0gcmVmPFtudW1iZXIsIG51bWJlcl0+KFsyMCwgNTBdKTsKCiAgICBjb25zdCBvbkFmdGVyQ2hhbmdlID0gKHZhbHVlOiBudW1iZXIpID0+IHsKICAgICAgY29uc29sZS5sb2coJ2FmdGVyQ2hhbmdlOiAnLCB2YWx1ZSk7CiAgICB9OwoKICAgIHJldHVybiB7CiAgICAgIHZhbHVlMSwKICAgICAgdmFsdWUyLAogICAgICBvbkFmdGVyQ2hhbmdlLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5jb2RlLWJveC1kZW1vIC5hbnQtc2xpZGVyIHsKICBtYXJnaW4tYm90dG9tOiAxNnB4Owp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgY2xhc3M9ImNvZGUtYm94LWRlbW8iPgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InZhbHVlMSIgQGFmdGVyQ2hhbmdlPSJvbkFmdGVyQ2hhbmdlIiAvPgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InZhbHVlMiIgcmFuZ2UgOnN0ZXA9IjEwIiBAYWZ0ZXJDaGFuZ2U9Im9uQWZ0ZXJDaGFuZ2UiIC8+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKZXhwb3J0IGRlZmF1bHQgZGVmaW5lQ29tcG9uZW50KHsKICBzZXR1cCgpIHsKICAgIGNvbnN0IHZhbHVlMSA9IHJlZigzMCk7CiAgICBjb25zdCB2YWx1ZTIgPSByZWYoWzIwLCA1MF0pOwogICAgY29uc3Qgb25BZnRlckNoYW5nZSA9IHZhbHVlID0+IHsKICAgICAgY29uc29sZS5sb2coJ2FmdGVyQ2hhbmdlOiAnLCB2YWx1ZSk7CiAgICB9OwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUxLAogICAgICB2YWx1ZTIsCiAgICAgIG9uQWZ0ZXJDaGFuZ2UsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIHNjb3BlZD4KLmNvZGUtYm94LWRlbW8gLmFudC1zbGlkZXIgewogIG1hcmdpbi1ib3R0b206IDE2cHg7Cn0KPC9zdHlsZT4="}},{default:c(()=>[n("div",M,[e(l,{value:t.value1,"onUpdate:value":s[0]||(s[0]=o=>t.value1=o),onAfterChange:t.onAfterChange},null,8,["value","onAfterChange"]),e(l,{value:t.value2,"onUpdate:value":s[1]||(s[1]=o=>t.value2=o),range:"",step:10,onAfterChange:t.onAfterChange},null,8,["value","onAfterChange"])])]),htmlCode:c(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("code-box-demo"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@afterChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onAfterChange"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@afterChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onAfterChange"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"["),a("number"),n("span",{class:"token punctuation"},","),a(" number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onAfterChange"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token punctuation"},"("),n("span",{class:"token parameter"},[n("span",{class:"token literal-property property"},"value"),n("span",{class:"token operator"},":"),a(" number")]),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'afterChange: '"),n("span",{class:"token punctuation"},","),a(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      onAfterChange`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"class"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("code-box-demo"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@afterChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onAfterChange"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"@afterChange"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("onAfterChange"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(),n("span",{class:"token function-variable function"},"onAfterChange"),a(),n("span",{class:"token operator"},"="),a(),n("span",{class:"token parameter"},"value"),a(),n("span",{class:"token operator"},"=>"),a(),n("span",{class:"token punctuation"},"{"),a(`
      console`),n("span",{class:"token punctuation"},"."),n("span",{class:"token function"},"log"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'afterChange: '"),n("span",{class:"token punctuation"},","),a(" value"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      onAfterChange`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const O=b(E,[["render",q],["__scopeId","data-v-5cfeaea2"]]),Q=A({setup(){const t=i(37),s=i([26,37]),k=i(37),g=i(37),C=i(37),m=i({0:"0\xB0C",26:"26\xB0C",37:"37\xB0C",100:{style:{color:"#f50"},label:"100\xB0C"}});return{value1:t,value2:s,value3:k,value4:g,value5:C,marks:m}}});const _={id:"components-slider-demo-mark"},$={key:0},nn={key:0},an={key:0},sn={key:0},tn={key:0};function on(t,s,k,g,C,m){const l=p("a-slider"),r=p("demo-box");return d(),h(r,{jsfiddle:{us:"Using `marks` property to mark a graduated slider, use `value` to specify the position of thumb. When `included` is false, means that different thumbs are coordinative. when `step` is null, users can only slide the thumbs onto marks.",cn:"\u4F7F\u7528 `marks` \u5C5E\u6027\u6807\u6CE8\u5206\u6BB5\u5F0F\u6ED1\u5757\uFF0C\u4F7F\u7528 `value` \u6307\u5B9A\u6ED1\u5757\u4F4D\u7F6E\u3002\u5F53 `included=false` \u65F6\uFF0C\u8868\u660E\u4E0D\u540C\u6807\u8BB0\u95F4\u4E3A\u5E76\u5217\u5173\u7CFB\u3002\u5F53 `step=null` \u65F6\uFF0CSlider \u7684\u53EF\u9009\u503C\u4EC5\u6709 `marks` \u6807\u51FA\u6765\u7684\u90E8\u5206\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u4F7F\u7528 <code>marks</code> \u5C5E\u6027\u6807\u6CE8\u5206\u6BB5\u5F0F\u6ED1\u5757\uFF0C\u4F7F\u7528 <code>value</code> \u6307\u5B9A\u6ED1\u5757\u4F4D\u7F6E\u3002\u5F53 <code>included=false</code> \u65F6\uFF0C\u8868\u660E\u4E0D\u540C\u6807\u8BB0\u95F4\u4E3A\u5E76\u5217\u5173\u7CFB\u3002\u5F53 <code>step=null</code> \u65F6\uFF0CSlider \u7684\u53EF\u9009\u503C\u4EC5\u6709 <code>marks</code> \u6807\u51FA\u6765\u7684\u90E8\u5206\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Using <code>marks</code> property to mark a graduated slider, use <code>value</code> to specify the position of thumb. When <code>included</code> is false, means that different thumbs are coordinative. when <code>step</code> is null, users can only slide the thumbs onto marks.</p>
`,order:5,title:{"zh-CN":"\u5E26\u6807\u7B7E\u7684\u6ED1\u5757","en-US":"Graduated slider"},relativePath:"components/slider/demo/mark.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgaWQ9ImNvbXBvbmVudHMtc2xpZGVyLWRlbW8tbWFyayI+CiAgICA8aDQ+aW5jbHVkZWQ9dHJ1ZTwvaDQ+CiAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiA6bWFya3M9Im1hcmtzIj4KICAgICAgPHRlbXBsYXRlICNtYXJrPSJ7IGxhYmVsLCBwb2ludCB9Ij4KICAgICAgICA8dGVtcGxhdGUgdi1pZj0icG9pbnQgPT09IDEwMCI+CiAgICAgICAgICA8c3Ryb25nPnt7IGxhYmVsIH19PC9zdHJvbmc+CiAgICAgICAgPC90ZW1wbGF0ZT4KICAgICAgICA8dGVtcGxhdGUgdi1lbHNlPnt7IGxhYmVsIH19PC90ZW1wbGF0ZT4KICAgICAgPC90ZW1wbGF0ZT4KICAgIDwvYS1zbGlkZXI+CiAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiByYW5nZSA6bWFya3M9Im1hcmtzIj4KICAgICAgPHRlbXBsYXRlICNtYXJrPSJ7IGxhYmVsLCBwb2ludCB9Ij4KICAgICAgICA8dGVtcGxhdGUgdi1pZj0icG9pbnQgPT09IDEwMCI+CiAgICAgICAgICA8c3Ryb25nPnt7IGxhYmVsIH19PC9zdHJvbmc+CiAgICAgICAgPC90ZW1wbGF0ZT4KICAgICAgICA8dGVtcGxhdGUgdi1lbHNlPnt7IGxhYmVsIH19PC90ZW1wbGF0ZT4KICAgICAgPC90ZW1wbGF0ZT4KICAgIDwvYS1zbGlkZXI+CgogICAgPGg0PmluY2x1ZGVkPWZhbHNlPC9oND4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTMiIDptYXJrcz0ibWFya3MiIDppbmNsdWRlZD0iZmFsc2UiPgogICAgICA8dGVtcGxhdGUgI21hcms9InsgbGFiZWwsIHBvaW50IH0iPgogICAgICAgIDx0ZW1wbGF0ZSB2LWlmPSJwb2ludCA9PT0gMTAwIj4KICAgICAgICAgIDxzdHJvbmc+e3sgbGFiZWwgfX08L3N0cm9uZz4KICAgICAgICA8L3RlbXBsYXRlPgogICAgICAgIDx0ZW1wbGF0ZSB2LWVsc2U+e3sgbGFiZWwgfX08L3RlbXBsYXRlPgogICAgICA8L3RlbXBsYXRlPgogICAgPC9hLXNsaWRlcj4KCiAgICA8aDQ+bWFya3MgJiBzdGVwPC9oND4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTQiIDptYXJrcz0ibWFya3MiIDpzdGVwPSIxMCI+CiAgICAgIDx0ZW1wbGF0ZSAjbWFyaz0ieyBsYWJlbCwgcG9pbnQgfSI+CiAgICAgICAgPHRlbXBsYXRlIHYtaWY9InBvaW50ID09PSAxMDAiPgogICAgICAgICAgPHN0cm9uZz57eyBsYWJlbCB9fTwvc3Ryb25nPgogICAgICAgIDwvdGVtcGxhdGU+CiAgICAgICAgPHRlbXBsYXRlIHYtZWxzZT57eyBsYWJlbCB9fTwvdGVtcGxhdGU+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2Etc2xpZGVyPgoKICAgIDxoND5zdGVwPW51bGw8L2g0PgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InZhbHVlNSIgOm1hcmtzPSJtYXJrcyIgOnN0ZXA9Im51bGwiPgogICAgICA8dGVtcGxhdGUgI21hcms9InsgbGFiZWwsIHBvaW50IH0iPgogICAgICAgIDx0ZW1wbGF0ZSB2LWlmPSJwb2ludCA9PT0gMTAwIj4KICAgICAgICAgIDxzdHJvbmc+e3sgbGFiZWwgfX08L3N0cm9uZz4KICAgICAgICA8L3RlbXBsYXRlPgogICAgICAgIDx0ZW1wbGF0ZSB2LWVsc2U+e3sgbGFiZWwgfX08L3RlbXBsYXRlPgogICAgICA8L3RlbXBsYXRlPgogICAgPC9hLXNsaWRlcj4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZTEgPSByZWY8bnVtYmVyPigzNyk7CiAgICBjb25zdCB2YWx1ZTIgPSByZWY8W251bWJlciwgbnVtYmVyXT4oWzI2LCAzN10pOwogICAgY29uc3QgdmFsdWUzID0gcmVmPG51bWJlcj4oMzcpOwogICAgY29uc3QgdmFsdWU0ID0gcmVmPG51bWJlcj4oMzcpOwogICAgY29uc3QgdmFsdWU1ID0gcmVmPG51bWJlcj4oMzcpOwogICAgY29uc3QgbWFya3MgPSByZWY8UmVjb3JkPG51bWJlciwgYW55Pj4oewogICAgICAwOiAnMMKwQycsCiAgICAgIDI2OiAnMjbCsEMnLAogICAgICAzNzogJzM3wrBDJywKICAgICAgMTAwOiB7CiAgICAgICAgc3R5bGU6IHsKICAgICAgICAgIGNvbG9yOiAnI2Y1MCcsCiAgICAgICAgfSwKICAgICAgICBsYWJlbDogJzEwMMKwQycsCiAgICAgIH0sCiAgICB9KTsKCiAgICByZXR1cm4gewogICAgICB2YWx1ZTEsCiAgICAgIHZhbHVlMiwKICAgICAgdmFsdWUzLAogICAgICB2YWx1ZTQsCiAgICAgIHZhbHVlNSwKICAgICAgbWFya3MsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIHNjb3BlZD4KI2NvbXBvbmVudHMtc2xpZGVyLWRlbW8tbWFyayBoNCB7CiAgbWFyZ2luOiAwIDAgMTZweDsKfQojY29tcG9uZW50cy1zbGlkZXItZGVtby1tYXJrIC5hbnQtc2xpZGVyLXdpdGgtbWFya3MgewogIG1hcmdpbi1ib3R0b206IDQ0cHg7Cn0KPC9zdHlsZT4K",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgaWQ9ImNvbXBvbmVudHMtc2xpZGVyLWRlbW8tbWFyayI+CiAgICA8aDQ+aW5jbHVkZWQ9dHJ1ZTwvaDQ+CiAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiA6bWFya3M9Im1hcmtzIj4KICAgICAgPHRlbXBsYXRlICNtYXJrPSJ7IGxhYmVsLCBwb2ludCB9Ij4KICAgICAgICA8dGVtcGxhdGUgdi1pZj0icG9pbnQgPT09IDEwMCI+CiAgICAgICAgICA8c3Ryb25nPnt7IGxhYmVsIH19PC9zdHJvbmc+CiAgICAgICAgPC90ZW1wbGF0ZT4KICAgICAgICA8dGVtcGxhdGUgdi1lbHNlPnt7IGxhYmVsIH19PC90ZW1wbGF0ZT4KICAgICAgPC90ZW1wbGF0ZT4KICAgIDwvYS1zbGlkZXI+CiAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiByYW5nZSA6bWFya3M9Im1hcmtzIj4KICAgICAgPHRlbXBsYXRlICNtYXJrPSJ7IGxhYmVsLCBwb2ludCB9Ij4KICAgICAgICA8dGVtcGxhdGUgdi1pZj0icG9pbnQgPT09IDEwMCI+CiAgICAgICAgICA8c3Ryb25nPnt7IGxhYmVsIH19PC9zdHJvbmc+CiAgICAgICAgPC90ZW1wbGF0ZT4KICAgICAgICA8dGVtcGxhdGUgdi1lbHNlPnt7IGxhYmVsIH19PC90ZW1wbGF0ZT4KICAgICAgPC90ZW1wbGF0ZT4KICAgIDwvYS1zbGlkZXI+CgogICAgPGg0PmluY2x1ZGVkPWZhbHNlPC9oND4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTMiIDptYXJrcz0ibWFya3MiIDppbmNsdWRlZD0iZmFsc2UiPgogICAgICA8dGVtcGxhdGUgI21hcms9InsgbGFiZWwsIHBvaW50IH0iPgogICAgICAgIDx0ZW1wbGF0ZSB2LWlmPSJwb2ludCA9PT0gMTAwIj4KICAgICAgICAgIDxzdHJvbmc+e3sgbGFiZWwgfX08L3N0cm9uZz4KICAgICAgICA8L3RlbXBsYXRlPgogICAgICAgIDx0ZW1wbGF0ZSB2LWVsc2U+e3sgbGFiZWwgfX08L3RlbXBsYXRlPgogICAgICA8L3RlbXBsYXRlPgogICAgPC9hLXNsaWRlcj4KCiAgICA8aDQ+bWFya3MgJiBzdGVwPC9oND4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTQiIDptYXJrcz0ibWFya3MiIDpzdGVwPSIxMCI+CiAgICAgIDx0ZW1wbGF0ZSAjbWFyaz0ieyBsYWJlbCwgcG9pbnQgfSI+CiAgICAgICAgPHRlbXBsYXRlIHYtaWY9InBvaW50ID09PSAxMDAiPgogICAgICAgICAgPHN0cm9uZz57eyBsYWJlbCB9fTwvc3Ryb25nPgogICAgICAgIDwvdGVtcGxhdGU+CiAgICAgICAgPHRlbXBsYXRlIHYtZWxzZT57eyBsYWJlbCB9fTwvdGVtcGxhdGU+CiAgICAgIDwvdGVtcGxhdGU+CiAgICA8L2Etc2xpZGVyPgoKICAgIDxoND5zdGVwPW51bGw8L2g0PgogICAgPGEtc2xpZGVyIHYtbW9kZWw6dmFsdWU9InZhbHVlNSIgOm1hcmtzPSJtYXJrcyIgOnN0ZXA9Im51bGwiPgogICAgICA8dGVtcGxhdGUgI21hcms9InsgbGFiZWwsIHBvaW50IH0iPgogICAgICAgIDx0ZW1wbGF0ZSB2LWlmPSJwb2ludCA9PT0gMTAwIj4KICAgICAgICAgIDxzdHJvbmc+e3sgbGFiZWwgfX08L3N0cm9uZz4KICAgICAgICA8L3RlbXBsYXRlPgogICAgICAgIDx0ZW1wbGF0ZSB2LWVsc2U+e3sgbGFiZWwgfX08L3RlbXBsYXRlPgogICAgICA8L3RlbXBsYXRlPgogICAgPC9hLXNsaWRlcj4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUxID0gcmVmKDM3KTsKICAgIGNvbnN0IHZhbHVlMiA9IHJlZihbMjYsIDM3XSk7CiAgICBjb25zdCB2YWx1ZTMgPSByZWYoMzcpOwogICAgY29uc3QgdmFsdWU0ID0gcmVmKDM3KTsKICAgIGNvbnN0IHZhbHVlNSA9IHJlZigzNyk7CiAgICBjb25zdCBtYXJrcyA9IHJlZih7CiAgICAgIDA6ICcwwrBDJywKICAgICAgMjY6ICcyNsKwQycsCiAgICAgIDM3OiAnMzfCsEMnLAogICAgICAxMDA6IHsKICAgICAgICBzdHlsZTogewogICAgICAgICAgY29sb3I6ICcjZjUwJywKICAgICAgICB9LAogICAgICAgIGxhYmVsOiAnMTAwwrBDJywKICAgICAgfSwKICAgIH0pOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUxLAogICAgICB2YWx1ZTIsCiAgICAgIHZhbHVlMywKICAgICAgdmFsdWU0LAogICAgICB2YWx1ZTUsCiAgICAgIG1hcmtzLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+CiNjb21wb25lbnRzLXNsaWRlci1kZW1vLW1hcmsgaDQgewogIG1hcmdpbjogMCAwIDE2cHg7Cn0KI2NvbXBvbmVudHMtc2xpZGVyLWRlbW8tbWFyayAuYW50LXNsaWRlci13aXRoLW1hcmtzIHsKICBtYXJnaW4tYm90dG9tOiA0NHB4Owp9Cjwvc3R5bGU+"}},{default:c(()=>[n("div",_,[s[5]||(s[5]=n("h4",null,"included=true",-1)),e(l,{value:t.value1,"onUpdate:value":s[0]||(s[0]=o=>t.value1=o),marks:t.marks},{mark:c(({label:o,point:u})=>[u===100?(d(),I("strong",$,v(o),1)):(d(),I(w,{key:1},[a(v(o),1)],64))]),_:1},8,["value","marks"]),e(l,{value:t.value2,"onUpdate:value":s[1]||(s[1]=o=>t.value2=o),range:"",marks:t.marks},{mark:c(({label:o,point:u})=>[u===100?(d(),I("strong",nn,v(o),1)):(d(),I(w,{key:1},[a(v(o),1)],64))]),_:1},8,["value","marks"]),s[6]||(s[6]=n("h4",null,"included=false",-1)),e(l,{value:t.value3,"onUpdate:value":s[2]||(s[2]=o=>t.value3=o),marks:t.marks,included:!1},{mark:c(({label:o,point:u})=>[u===100?(d(),I("strong",an,v(o),1)):(d(),I(w,{key:1},[a(v(o),1)],64))]),_:1},8,["value","marks"]),s[7]||(s[7]=n("h4",null,"marks & step",-1)),e(l,{value:t.value4,"onUpdate:value":s[3]||(s[3]=o=>t.value4=o),marks:t.marks,step:10},{mark:c(({label:o,point:u})=>[u===100?(d(),I("strong",sn,v(o),1)):(d(),I(w,{key:1},[a(v(o),1)],64))]),_:1},8,["value","marks"]),s[8]||(s[8]=n("h4",null,"step=null",-1)),e(l,{value:t.value5,"onUpdate:value":s[4]||(s[4]=o=>t.value5=o),marks:t.marks,step:null},{mark:c(({label:o,point:u})=>[u===100?(d(),I("strong",tn,v(o),1)):(d(),I(w,{key:1},[a(v(o),1)],64))]),_:1},8,["value","marks"])])]),htmlCode:c(()=>s[9]||(s[9]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("components-slider-demo-mark"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("included=true"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`

    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("included=false"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":included"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("false"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`

    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("marks & step"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value4"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`

    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("step=null"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value5"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("null"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"["),a("number"),n("span",{class:"token punctuation"},","),a(" number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"26"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value3 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value4 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value5 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" marks "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("Record"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token punctuation"},","),a(" any"),n("span",{class:"token operator"},">>"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token number"},"0"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'0\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"26"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'26\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"37"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'37\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"100"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
          `),n("span",{class:"token literal-property property"},"color"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'#f50'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'100\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      value3`),n("span",{class:"token punctuation"},","),a(`
      value4`),n("span",{class:"token punctuation"},","),a(`
      value5`),n("span",{class:"token punctuation"},","),a(`
      marks`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},"#components-slider-demo-mark h4"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 0 0 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"#components-slider-demo-mark .ant-slider-with-marks"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 44px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[10]||(s[10]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token attr-name"},"id"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("components-slider-demo-mark"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("included=true"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`

    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("included=false"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":included"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("false"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`

    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("marks & step"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value4"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`

    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("h4")]),n("span",{class:"token punctuation"},">")]),a("step=null"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("h4")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value5"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("null"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"#mark"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("{ label, point }"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-if"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("point === 100"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),a(`
          `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("strong")]),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("strong")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
        `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),a(),n("span",{class:"token attr-name"},"v-else"),n("span",{class:"token punctuation"},">")]),a("{{ label }}"),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("a-slider")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"26"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value3 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value4 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value5 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" marks "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token number"},"0"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'0\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"26"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'26\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"37"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'37\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"100"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
          `),n("span",{class:"token literal-property property"},"color"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'#f50'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'100\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      value3`),n("span",{class:"token punctuation"},","),a(`
      value4`),n("span",{class:"token punctuation"},","),a(`
      value5`),n("span",{class:"token punctuation"},","),a(`
      marks`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},"#components-slider-demo-mark h4"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin"),n("span",{class:"token punctuation"},":"),a(" 0 0 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`),n("span",{class:"token selector"},"#components-slider-demo-mark .ant-slider-with-marks"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 44px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const en=b(Q,[["render",on],["__scopeId","data-v-625ce7e8"]]),cn=A({setup(){const t=i(30),s=i([20,50]),k=i([26,37]),g=i({0:"0\xB0C",26:"26\xB0C",37:"37\xB0C",100:{style:{color:"#f50"},label:e("strong",{},"100\xB0C")}});return{value1:t,value2:s,value3:k,marks:g}}});const pn={style:{height:"300px"}},ln={style:{display:"inline-block",height:"300px","margin-left":"70px"}},un={style:{display:"inline-block",height:"300px","margin-left":"70px"}},kn={style:{display:"inline-block",height:"300px","margin-left":"70px"}};function rn(t,s,k,g,C,m){const l=p("a-slider"),r=p("demo-box");return d(),h(r,{jsfiddle:{us:"The vertical Slider.",cn:"\u5782\u76F4\u65B9\u5411\u7684 Slider\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5782\u76F4\u65B9\u5411\u7684 Slider\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>The vertical Slider.</p>
`,order:6,title:{"zh-CN":"\u5782\u76F4","en-US":"Vertical"},relativePath:"components/slider/demo/vertical.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXYgc3R5bGU9ImhlaWdodDogMzAwcHgiPgogICAgPGRpdiBzdHlsZT0iZGlzcGxheTogaW5saW5lLWJsb2NrOyBoZWlnaHQ6IDMwMHB4OyBtYXJnaW4tbGVmdDogNzBweCI+CiAgICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTEiIHZlcnRpY2FsIC8+CiAgICA8L2Rpdj4KICAgIDxkaXYgc3R5bGU9ImRpc3BsYXk6IGlubGluZS1ibG9jazsgaGVpZ2h0OiAzMDBweDsgbWFyZ2luLWxlZnQ6IDcwcHgiPgogICAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiB2ZXJ0aWNhbCByYW5nZSA6c3RlcD0iMTAiIC8+CiAgICA8L2Rpdj4KICAgIDxkaXYgc3R5bGU9ImRpc3BsYXk6IGlubGluZS1ibG9jazsgaGVpZ2h0OiAzMDBweDsgbWFyZ2luLWxlZnQ6IDcwcHgiPgogICAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiB2ZXJ0aWNhbCByYW5nZSA6bWFya3M9Im1hcmtzIiAvPgogICAgPC9kaXY+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQgbGFuZz0idHMiPgppbXBvcnQgeyBkZWZpbmVDb21wb25lbnQsIHJlZiwgY3JlYXRlVk5vZGUgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUxID0gcmVmPG51bWJlcj4oMzApOwogICAgY29uc3QgdmFsdWUyID0gcmVmPFtudW1iZXIsIG51bWJlcl0+KFsyMCwgNTBdKTsKICAgIGNvbnN0IHZhbHVlMyA9IHJlZjxbbnVtYmVyLCBudW1iZXJdPihbMjYsIDM3XSk7CiAgICBjb25zdCBtYXJrcyA9IHJlZjxSZWNvcmQ8bnVtYmVyLCBhbnk+Pih7CiAgICAgIDA6ICcwwrBDJywKICAgICAgMjY6ICcyNsKwQycsCiAgICAgIDM3OiAnMzfCsEMnLAogICAgICAxMDA6IHsKICAgICAgICBzdHlsZTogewogICAgICAgICAgY29sb3I6ICcjZjUwJywKICAgICAgICB9LAogICAgICAgIGxhYmVsOiBjcmVhdGVWTm9kZSgnc3Ryb25nJywge30sICcxMDDCsEMnKSwKICAgICAgfSwKICAgIH0pOwoKICAgIHJldHVybiB7CiAgICAgIHZhbHVlMSwKICAgICAgdmFsdWUyLAogICAgICB2YWx1ZTMsCiAgICAgIG1hcmtzLAogICAgfTsKICB9LAp9KTsKPC9zY3JpcHQ+CjxzdHlsZSBzY29wZWQ+Ci5jb2RlLWJveC1kZW1vIC5hbnQtc2xpZGVyIHsKICBtYXJnaW4tYm90dG9tOiAxNnB4Owp9Cjwvc3R5bGU+Cg==",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXYgc3R5bGU9ImhlaWdodDogMzAwcHgiPgogICAgPGRpdiBzdHlsZT0iZGlzcGxheTogaW5saW5lLWJsb2NrOyBoZWlnaHQ6IDMwMHB4OyBtYXJnaW4tbGVmdDogNzBweCI+CiAgICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTEiIHZlcnRpY2FsIC8+CiAgICA8L2Rpdj4KICAgIDxkaXYgc3R5bGU9ImRpc3BsYXk6IGlubGluZS1ibG9jazsgaGVpZ2h0OiAzMDBweDsgbWFyZ2luLWxlZnQ6IDcwcHgiPgogICAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUyIiB2ZXJ0aWNhbCByYW5nZSA6c3RlcD0iMTAiIC8+CiAgICA8L2Rpdj4KICAgIDxkaXYgc3R5bGU9ImRpc3BsYXk6IGlubGluZS1ibG9jazsgaGVpZ2h0OiAzMDBweDsgbWFyZ2luLWxlZnQ6IDcwcHgiPgogICAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUzIiB2ZXJ0aWNhbCByYW5nZSA6bWFya3M9Im1hcmtzIiAvPgogICAgPC9kaXY+CiAgPC9kaXY+CjwvdGVtcGxhdGU+CjxzY3JpcHQ+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmLCBjcmVhdGVWTm9kZSB9IGZyb20gJ3Z1ZSc7CmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZTEgPSByZWYoMzApOwogICAgY29uc3QgdmFsdWUyID0gcmVmKFsyMCwgNTBdKTsKICAgIGNvbnN0IHZhbHVlMyA9IHJlZihbMjYsIDM3XSk7CiAgICBjb25zdCBtYXJrcyA9IHJlZih7CiAgICAgIDA6ICcwwrBDJywKICAgICAgMjY6ICcyNsKwQycsCiAgICAgIDM3OiAnMzfCsEMnLAogICAgICAxMDA6IHsKICAgICAgICBzdHlsZTogewogICAgICAgICAgY29sb3I6ICcjZjUwJywKICAgICAgICB9LAogICAgICAgIGxhYmVsOiBjcmVhdGVWTm9kZSgnc3Ryb25nJywge30sICcxMDDCsEMnKSwKICAgICAgfSwKICAgIH0pOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUxLAogICAgICB2YWx1ZTIsCiAgICAgIHZhbHVlMywKICAgICAgbWFya3MsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4KPHN0eWxlIHNjb3BlZD4KLmNvZGUtYm94LWRlbW8gLmFudC1zbGlkZXIgewogIG1hcmdpbi1ib3R0b206IDE2cHg7Cn0KPC9zdHlsZT4="}},{default:c(()=>[n("div",pn,[n("div",ln,[e(l,{value:t.value1,"onUpdate:value":s[0]||(s[0]=o=>t.value1=o),vertical:""},null,8,["value"])]),n("div",un,[e(l,{value:t.value2,"onUpdate:value":s[1]||(s[1]=o=>t.value2=o),vertical:"",range:"",step:10},null,8,["value"])]),n("div",kn,[e(l,{value:t.value3,"onUpdate:value":s[2]||(s[2]=o=>t.value3=o),vertical:"",range:"",marks:t.marks},null,8,["value","marks"])])])]),htmlCode:c(()=>s[3]||(s[3]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" inline-block"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 70px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"vertical"),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" inline-block"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 70px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"vertical"),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" inline-block"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 70px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"vertical"),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" createVNode "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"["),a("number"),n("span",{class:"token punctuation"},","),a(" number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value3 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"["),a("number"),n("span",{class:"token punctuation"},","),a(" number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"26"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" marks "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("Record"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token punctuation"},","),a(" any"),n("span",{class:"token operator"},">>"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token number"},"0"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'0\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"26"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'26\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"37"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'37\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"100"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
          `),n("span",{class:"token literal-property property"},"color"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'#f50'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'strong'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'100\xB0C'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      value3`),n("span",{class:"token punctuation"},","),a(`
      marks`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" inline-block"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 70px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"vertical"),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" inline-block"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 70px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"vertical"),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":step"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("10"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),a(),n("span",{class:"token special-attr"},[n("span",{class:"token attr-name"},"style"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),n("span",{class:"token value css language-css"},[n("span",{class:"token property"},"display"),n("span",{class:"token punctuation"},":"),a(" inline-block"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"height"),n("span",{class:"token punctuation"},":"),a(" 300px"),n("span",{class:"token punctuation"},";"),a(),n("span",{class:"token property"},"margin-left"),n("span",{class:"token punctuation"},":"),a(" 70px")]),n("span",{class:"token punctuation"},'"')])]),n("span",{class:"token punctuation"},">")]),a(`
      `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value3"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"vertical"),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":marks"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("marks"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref"),n("span",{class:"token punctuation"},","),a(" createVNode "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value3 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"26"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"37"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" marks "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
      `),n("span",{class:"token number"},"0"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'0\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"26"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'26\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"37"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'37\xB0C'"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token number"},"100"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
        `),n("span",{class:"token literal-property property"},"style"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token punctuation"},"{"),a(`
          `),n("span",{class:"token literal-property property"},"color"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token string"},"'#f50'"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
        `),n("span",{class:"token literal-property property"},"label"),n("span",{class:"token operator"},":"),a(),n("span",{class:"token function"},"createVNode"),n("span",{class:"token punctuation"},"("),n("span",{class:"token string"},"'strong'"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token punctuation"},"{"),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token string"},"'100\xB0C'"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},","),a(`
      `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      value3`),n("span",{class:"token punctuation"},","),a(`
      marks`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("style")]),a(),n("span",{class:"token attr-name"},"scoped"),n("span",{class:"token punctuation"},">")]),n("span",{class:"token style"},[n("span",{class:"token language-css"},[a(`
`),n("span",{class:"token selector"},".code-box-demo .ant-slider"),a(),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token property"},"margin-bottom"),n("span",{class:"token punctuation"},":"),a(" 16px"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token punctuation"},"}"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("style")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const dn=b(cn,[["render",rn],["__scopeId","data-v-7c5db5bf"]]),gn=A({setup(){return{value:i(30)}}});function mn(t,s,k,g,C,m){const l=p("a-slider"),r=p("demo-box");return d(),h(r,{jsfiddle:{us:"When `tooltipVisible` is `true`, ToolTip will show always, or ToolTip will not show anyway, even if dragging or hovering.",cn:"\u5F53 `tooltipVisible` \u4E3A `true` \u65F6\uFF0C\u5C06\u59CB\u7EC8\u663E\u793A ToolTip\uFF1B\u53CD\u4E4B\u5219\u59CB\u7EC8\u4E0D\u663E\u793A\uFF0C\u5373\u4F7F\u5728\u62D6\u52A8\u3001\u79FB\u5165\u65F6\u4E5F\u662F\u5982\u6B64\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5F53 <code>tooltipVisible</code> \u4E3A <code>true</code> \u65F6\uFF0C\u5C06\u59CB\u7EC8\u663E\u793A ToolTip\uFF1B\u53CD\u4E4B\u5219\u59CB\u7EC8\u4E0D\u663E\u793A\uFF0C\u5373\u4F7F\u5728\u62D6\u52A8\u3001\u79FB\u5165\u65F6\u4E5F\u662F\u5982\u6B64\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>When <code>tooltipVisible</code> is <code>true</code>, ToolTip will show always, or ToolTip will not show anyway, even if dragging or hovering.</p>
`,order:7,title:{"zh-CN":"\u63A7\u5236 ToolTip \u7684\u663E\u793A","en-US":"Control visible of ToolTip"},relativePath:"components/slider/demo/show-tooltip.vue",sourceCode:"PHRlbXBsYXRlPgogIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgOnRvb2x0aXAtdmlzaWJsZT0idHJ1ZSIgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZSA9IHJlZjxudW1iZXI+KDMwKTsKCiAgICByZXR1cm4gewogICAgICB2YWx1ZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZSIgOnRvb2x0aXAtdmlzaWJsZT0idHJ1ZSIgLz4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUgPSByZWYoMzApOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:c(()=>[e(l,{value:t.value,"onUpdate:value":s[0]||(s[0]=o=>t.value=o),"tooltip-visible":!0},null,8,["value"])]),htmlCode:c(()=>s[1]||(s[1]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tooltip-visible"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("true"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[2]||(s[2]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":tooltip-visible"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("true"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const Cn=b(gn,[["render",mn]]),In=A({setup(){const t=i(30),s=i([20,50]),k=i(!0);return{value1:t,value2:s,reverse:k}}});function bn(t,s,k,g,C,m){const l=p("a-slider"),r=p("a-switch"),o=p("demo-box");return d(),h(o,{jsfiddle:{us:"Using `reverse` to render slider reversely.",cn:"\u8BBE\u7F6E `reverse` \u53EF\u4EE5\u5C06\u6ED1\u52A8\u6761\u7F6E\u53CD\u3002",docHtml:`<h2 id="zh-CN">zh-CN <a class="header-anchor" href="#zh-CN">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u8BBE\u7F6E <code>reverse</code> \u53EF\u4EE5\u5C06\u6ED1\u52A8\u6761\u7F6E\u53CD\u3002</p>
<h2 id="en-US">en-US <a class="header-anchor" href="#en-US">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>Using <code>reverse</code> to render slider reversely.</p>
`,order:8,title:{"zh-CN":"\u53CD\u5411","en-US":"Reverse"},relativePath:"components/slider/demo/reverse.vue",sourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiA6cmV2ZXJzZT0icmV2ZXJzZSIgLz4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIHJhbmdlIDpyZXZlcnNlPSJyZXZlcnNlIiAvPgogICAgUmV2ZXJzZWQ6CiAgICA8YS1zd2l0Y2ggdi1tb2RlbDpjaGVja2VkPSJyZXZlcnNlIiBzaXplPSJzbWFsbCIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdCBsYW5nPSJ0cyI+CmltcG9ydCB7IGRlZmluZUNvbXBvbmVudCwgcmVmIH0gZnJvbSAndnVlJzsKCmV4cG9ydCBkZWZhdWx0IGRlZmluZUNvbXBvbmVudCh7CiAgc2V0dXAoKSB7CiAgICBjb25zdCB2YWx1ZTEgPSByZWY8bnVtYmVyPigzMCk7CiAgICBjb25zdCB2YWx1ZTIgPSByZWY8W251bWJlciwgbnVtYmVyXT4oWzIwLCA1MF0pOwogICAgY29uc3QgcmV2ZXJzZSA9IHJlZjxib29sZWFuPih0cnVlKTsKCiAgICByZXR1cm4gewogICAgICB2YWx1ZTEsCiAgICAgIHZhbHVlMiwKICAgICAgcmV2ZXJzZSwKICAgIH07CiAgfSwKfSk7Cjwvc2NyaXB0PgoK",jsSourceCode:"PHRlbXBsYXRlPgogIDxkaXY+CiAgICA8YS1zbGlkZXIgdi1tb2RlbDp2YWx1ZT0idmFsdWUxIiA6cmV2ZXJzZT0icmV2ZXJzZSIgLz4KICAgIDxhLXNsaWRlciB2LW1vZGVsOnZhbHVlPSJ2YWx1ZTIiIHJhbmdlIDpyZXZlcnNlPSJyZXZlcnNlIiAvPgogICAgUmV2ZXJzZWQ6CiAgICA8YS1zd2l0Y2ggdi1tb2RlbDpjaGVja2VkPSJyZXZlcnNlIiBzaXplPSJzbWFsbCIgLz4KICA8L2Rpdj4KPC90ZW1wbGF0ZT4KPHNjcmlwdD4KaW1wb3J0IHsgZGVmaW5lQ29tcG9uZW50LCByZWYgfSBmcm9tICd2dWUnOwpleHBvcnQgZGVmYXVsdCBkZWZpbmVDb21wb25lbnQoewogIHNldHVwKCkgewogICAgY29uc3QgdmFsdWUxID0gcmVmKDMwKTsKICAgIGNvbnN0IHZhbHVlMiA9IHJlZihbMjAsIDUwXSk7CiAgICBjb25zdCByZXZlcnNlID0gcmVmKHRydWUpOwogICAgcmV0dXJuIHsKICAgICAgdmFsdWUxLAogICAgICB2YWx1ZTIsCiAgICAgIHJldmVyc2UsCiAgICB9OwogIH0sCn0pOwo8L3NjcmlwdD4="}},{default:c(()=>[n("div",null,[e(l,{value:t.value1,"onUpdate:value":s[0]||(s[0]=u=>t.value1=u),reverse:t.reverse},null,8,["value","reverse"]),e(l,{value:t.value2,"onUpdate:value":s[1]||(s[1]=u=>t.value2=u),range:"",reverse:t.reverse},null,8,["value","reverse"]),s[3]||(s[3]=a(" Reversed: ")),e(r,{checked:t.reverse,"onUpdate:checked":s[2]||(s[2]=u=>t.reverse=u),size:"small"},null,8,["checked"])])]),htmlCode:c(()=>s[4]||(s[4]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":reverse"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("reverse"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":reverse"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("reverse"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    Reversed:
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("reverse"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),a(),n("span",{class:"token attr-name"},"lang"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("ts"),n("span",{class:"token punctuation"},'"')]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`

`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("number"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),n("span",{class:"token punctuation"},"["),a("number"),n("span",{class:"token punctuation"},","),a(" number"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" reverse "),n("span",{class:"token operator"},"="),a(" ref"),n("span",{class:"token operator"},"<"),a("boolean"),n("span",{class:"token operator"},">"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`

    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      reverse`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),jsVersionHtml:c(()=>s[5]||(s[5]=[n("pre",{class:"language-vue"},[n("code",null,[n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value1"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},":reverse"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("reverse"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-slider")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("value")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("value2"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"range"),a(),n("span",{class:"token attr-name"},":reverse"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("reverse"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
    Reversed:
    `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("a-switch")]),a(),n("span",{class:"token attr-name"},[n("span",{class:"token namespace"},"v-model:"),a("checked")]),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("reverse"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token attr-name"},"size"),n("span",{class:"token attr-value"},[n("span",{class:"token punctuation attr-equals"},"="),n("span",{class:"token punctuation"},'"'),a("small"),n("span",{class:"token punctuation"},'"')]),a(),n("span",{class:"token punctuation"},"/>")]),a(`
  `),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("div")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("template")]),n("span",{class:"token punctuation"},">")]),a(`
`),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"<"),a("script")]),n("span",{class:"token punctuation"},">")]),n("span",{class:"token script"},[n("span",{class:"token language-javascript"},[a(`
`),n("span",{class:"token keyword"},"import"),a(),n("span",{class:"token punctuation"},"{"),a(" defineComponent"),n("span",{class:"token punctuation"},","),a(" ref "),n("span",{class:"token punctuation"},"}"),a(),n("span",{class:"token keyword"},"from"),a(),n("span",{class:"token string"},"'vue'"),n("span",{class:"token punctuation"},";"),a(`
`),n("span",{class:"token keyword"},"export"),a(),n("span",{class:"token keyword"},"default"),a(),n("span",{class:"token function"},"defineComponent"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"{"),a(`
  `),n("span",{class:"token function"},"setup"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},")"),a(),n("span",{class:"token punctuation"},"{"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value1 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token number"},"30"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" value2 "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token punctuation"},"["),n("span",{class:"token number"},"20"),n("span",{class:"token punctuation"},","),a(),n("span",{class:"token number"},"50"),n("span",{class:"token punctuation"},"]"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"const"),a(" reverse "),n("span",{class:"token operator"},"="),a(),n("span",{class:"token function"},"ref"),n("span",{class:"token punctuation"},"("),n("span",{class:"token boolean"},"true"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
    `),n("span",{class:"token keyword"},"return"),a(),n("span",{class:"token punctuation"},"{"),a(`
      value1`),n("span",{class:"token punctuation"},","),a(`
      value2`),n("span",{class:"token punctuation"},","),a(`
      reverse`),n("span",{class:"token punctuation"},","),a(`
    `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},";"),a(`
  `),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},","),a(`
`),n("span",{class:"token punctuation"},"}"),n("span",{class:"token punctuation"},")"),n("span",{class:"token punctuation"},";"),a(`
`)])]),n("span",{class:"token tag"},[n("span",{class:"token tag"},[n("span",{class:"token punctuation"},"</"),a("script")]),n("span",{class:"token punctuation"},">")]),a(`
`)])],-1)])),_:1})}const vn=b(In,[["render",bn]]),An={pageData:{title:"Slider",description:"",frontmatter:{category:"Components",subtitle:"\u6ED1\u52A8\u8F93\u5165\u6761",type:"\u6570\u636E\u5F55\u5165",title:"Slider",cover:"https://gw.alipayobjects.com/zos/alicdn/HZ3meFc6W/Silder.svg"},headers:[{level:2,title:"\u4F55\u65F6\u4F7F\u7528",slug:"\u4F55\u65F6\u4F7F\u7528",content:"\u5F53\u7528\u6237\u9700\u8981\u5728\u6570\u503C\u533A\u95F4/\u81EA\u5B9A\u4E49\u533A\u95F4\u5185\u8FDB\u884C\u9009\u62E9\u65F6\uFF0C\u53EF\u4E3A\u8FDE\u7EED\u6216\u79BB\u6563\u503C\u3002"},{level:2,title:"API",slug:"API",content:""},{level:3,title:"\u4E8B\u4EF6",slug:"\u4E8B\u4EF6",content:""},{level:2,title:"\u65B9\u6CD5",slug:"\u65B9\u6CD5",content:""}],relativePath:"components/slider/index.zh-CN.md",content:`
\u6ED1\u52A8\u578B\u8F93\u5165\u5668\uFF0C\u5C55\u793A\u5F53\u524D\u503C\u548C\u53EF\u9009\u8303\u56F4\u3002

## \u4F55\u65F6\u4F7F\u7528

\u5F53\u7528\u6237\u9700\u8981\u5728\u6570\u503C\u533A\u95F4/\u81EA\u5B9A\u4E49\u533A\u95F4\u5185\u8FDB\u884C\u9009\u62E9\u65F6\uFF0C\u53EF\u4E3A\u8FDE\u7EED\u6216\u79BB\u6563\u503C\u3002

## API

| \u53C2\u6570 | \u8BF4\u660E | \u7C7B\u578B | \u9ED8\u8BA4\u503C | \u7248\u672C |
| --- | --- | --- | --- | --- |
| autofocus | \u81EA\u52A8\u83B7\u53D6\u7126\u70B9 | boolean | false |  |
| disabled | \u503C\u4E3A \`true\` \u65F6\uFF0C\u6ED1\u5757\u4E3A\u7981\u7528\u72B6\u6001 | boolean | false |  |
| dots | \u662F\u5426\u53EA\u80FD\u62D6\u62FD\u5230\u523B\u5EA6\u4E0A | boolean | false |  |
| getTooltipPopupContainer | Tooltip \u6E32\u67D3\u7236\u8282\u70B9\uFF0C\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\u3002 | Function | () =&gt; document.body | 1.5.0 |
| included | \`marks\` \u4E0D\u4E3A\u7A7A\u5BF9\u8C61\u65F6\u6709\u6548\uFF0C\u503C\u4E3A true \u65F6\u8868\u793A\u503C\u4E3A\u5305\u542B\u5173\u7CFB\uFF0Cfalse \u8868\u793A\u5E76\u5217 | boolean | true |  |
| mark | \u81EA\u5B9A\u4E49\u523B\u5EA6\u6807\u8BB0 | v-slot:mark | { point: number, label: any } | 3.0 |
| marks | \u523B\u5EA6\u6807\u8BB0\uFF0Ckey \u7684\u7C7B\u578B\u5FC5\u987B\u4E3A \`number\` \u4E14\u53D6\u503C\u5728\u95ED\u533A\u95F4 \\[min, max] \u5185\uFF0C\u6BCF\u4E2A\u6807\u7B7E\u53EF\u4EE5\u5355\u72EC\u8BBE\u7F6E\u6837\u5F0F | object | { number: string\\|VNode } or { number: { style: object, label: string\\|VNode } } or { number: () =&gt; VNode } |  |
| max | \u6700\u5927\u503C | number | 100 |  |
| min | \u6700\u5C0F\u503C | number | 0 |  |
| range | \u53CC\u6ED1\u5757\u6A21\u5F0F | boolean | false |  |
| reverse | \u53CD\u5411\u5750\u6807\u8F74 | boolean | false | 1.5.0 |
| step | \u6B65\u957F\uFF0C\u53D6\u503C\u5FC5\u987B\u5927\u4E8E 0\uFF0C\u5E76\u4E14\u53EF\u88AB (max - min) \u6574\u9664\u3002\u5F53 \`marks\` \u4E0D\u4E3A\u7A7A\u5BF9\u8C61\u65F6\uFF0C\u53EF\u4EE5\u8BBE\u7F6E \`step\` \u4E3A \`null\`\uFF0C\u6B64\u65F6 Slider \u7684\u53EF\u9009\u503C\u4EC5\u6709 marks \u6807\u51FA\u6765\u7684\u90E8\u5206\u3002 | number\\|null | 1 |  |
| tipFormatter | Slider \u4F1A\u628A\u5F53\u524D\u503C\u4F20\u7ED9 \`tipFormatter\`\uFF0C\u5E76\u5728 Tooltip \u4E2D\u663E\u793A \`tipFormatter\` \u7684\u8FD4\u56DE\u503C\uFF0C\u82E5\u4E3A null\uFF0C\u5219\u9690\u85CF Tooltip\u3002 | Function\\|null | IDENTITY |  |
| tooltipPlacement | \u8BBE\u7F6E Tooltip \u5C55\u793A\u4F4D\u7F6E\u3002\u53C2\u8003 [\`Tooltip\`](/components/tooltip/)\u3002 | string |  | 1.5.0 |
| tooltipVisible | \u503C\u4E3A\`true\`\u65F6\uFF0CTooltip \u5C06\u4F1A\u59CB\u7EC8\u663E\u793A\uFF1B\u5426\u5219\u59CB\u7EC8\u4E0D\u663E\u793A\uFF0C\u54EA\u6015\u5728\u62D6\u62FD\u53CA\u79FB\u5165\u65F6\u3002 | Boolean |  |  |
| value(v-model) | \u8BBE\u7F6E\u5F53\u524D\u53D6\u503C\u3002\u5F53 \`range\` \u4E3A \`false\` \u65F6\uFF0C\u4F7F\u7528 \`number\`\uFF0C\u5426\u5219\u7528 \`[number, number]\` | number\\|number\\[] |  |  |
| vertical | \u503C\u4E3A \`true\` \u65F6\uFF0CSlider \u4E3A\u5782\u76F4\u65B9\u5411 | Boolean | false |  |

### \u4E8B\u4EF6

| \u4E8B\u4EF6\u540D\u79F0 | \u8BF4\u660E | \u56DE\u8C03\u53C2\u6570 |  |
| --- | --- | --- | --- |
| change | \u5F53 Slider \u7684\u503C\u53D1\u751F\u6539\u53D8\u65F6\uFF0C\u4F1A\u89E6\u53D1 change \u4E8B\u4EF6\uFF0C\u5E76\u628A\u6539\u53D8\u540E\u7684\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002 | Function(value) | NOOP |
| afterChange | \u4E0E \`mouseup\` \u89E6\u53D1\u65F6\u673A\u4E00\u81F4\uFF0C\u628A\u5F53\u524D\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002 | Function(value) | NOOP |

## \u65B9\u6CD5

| \u540D\u79F0    | \u63CF\u8FF0     |
| ------- | -------- |
| blur()  | \u79FB\u9664\u7126\u70B9 |
| focus() | \u83B7\u53D6\u7126\u70B9 |
`,html:`<p>\u6ED1\u52A8\u578B\u8F93\u5165\u5668\uFF0C\u5C55\u793A\u5F53\u524D\u503C\u548C\u53EF\u9009\u8303\u56F4\u3002</p>
<h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>\u5F53\u7528\u6237\u9700\u8981\u5728\u6570\u503C\u533A\u95F4/\u81EA\u5B9A\u4E49\u533A\u95F4\u5185\u8FDB\u884C\u9009\u62E9\u65F6\uFF0C\u53EF\u4E3A\u8FDE\u7EED\u6216\u79BB\u6563\u503C\u3002</p>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<table>
<thead>
<tr>
<th>\u53C2\u6570</th>
<th>\u8BF4\u660E</th>
<th>\u7C7B\u578B</th>
<th>\u9ED8\u8BA4\u503C</th>
<th>\u7248\u672C</th>
</tr>
</thead>
<tbody>
<tr>
<td>autofocus</td>
<td>\u81EA\u52A8\u83B7\u53D6\u7126\u70B9</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>disabled</td>
<td>\u503C\u4E3A <code>true</code> \u65F6\uFF0C\u6ED1\u5757\u4E3A\u7981\u7528\u72B6\u6001</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>dots</td>
<td>\u662F\u5426\u53EA\u80FD\u62D6\u62FD\u5230\u523B\u5EA6\u4E0A</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>getTooltipPopupContainer</td>
<td>Tooltip \u6E32\u67D3\u7236\u8282\u70B9\uFF0C\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\u3002</td>
<td>Function</td>
<td>() =&gt; document.body</td>
<td>1.5.0</td>
</tr>
<tr>
<td>included</td>
<td><code>marks</code> \u4E0D\u4E3A\u7A7A\u5BF9\u8C61\u65F6\u6709\u6548\uFF0C\u503C\u4E3A true \u65F6\u8868\u793A\u503C\u4E3A\u5305\u542B\u5173\u7CFB\uFF0Cfalse \u8868\u793A\u5E76\u5217</td>
<td>boolean</td>
<td>true</td>
<td></td>
</tr>
<tr>
<td>mark</td>
<td>\u81EA\u5B9A\u4E49\u523B\u5EA6\u6807\u8BB0</td>
<td>v-slot:mark</td>
<td>{ point: number, label: any }</td>
<td>3.0</td>
</tr>
<tr>
<td>marks</td>
<td>\u523B\u5EA6\u6807\u8BB0\uFF0Ckey \u7684\u7C7B\u578B\u5FC5\u987B\u4E3A <code>number</code> \u4E14\u53D6\u503C\u5728\u95ED\u533A\u95F4 [min, max] \u5185\uFF0C\u6BCF\u4E2A\u6807\u7B7E\u53EF\u4EE5\u5355\u72EC\u8BBE\u7F6E\u6837\u5F0F</td>
<td>object</td>
<td>{ number: string|VNode } or { number: { style: object, label: string|VNode } } or { number: () =&gt; VNode }</td>
<td></td>
</tr>
<tr>
<td>max</td>
<td>\u6700\u5927\u503C</td>
<td>number</td>
<td>100</td>
<td></td>
</tr>
<tr>
<td>min</td>
<td>\u6700\u5C0F\u503C</td>
<td>number</td>
<td>0</td>
<td></td>
</tr>
<tr>
<td>range</td>
<td>\u53CC\u6ED1\u5757\u6A21\u5F0F</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>reverse</td>
<td>\u53CD\u5411\u5750\u6807\u8F74</td>
<td>boolean</td>
<td>false</td>
<td>1.5.0</td>
</tr>
<tr>
<td>step</td>
<td>\u6B65\u957F\uFF0C\u53D6\u503C\u5FC5\u987B\u5927\u4E8E 0\uFF0C\u5E76\u4E14\u53EF\u88AB (max - min) \u6574\u9664\u3002\u5F53 <code>marks</code> \u4E0D\u4E3A\u7A7A\u5BF9\u8C61\u65F6\uFF0C\u53EF\u4EE5\u8BBE\u7F6E <code>step</code> \u4E3A <code>null</code>\uFF0C\u6B64\u65F6 Slider \u7684\u53EF\u9009\u503C\u4EC5\u6709 marks \u6807\u51FA\u6765\u7684\u90E8\u5206\u3002</td>
<td>number|null</td>
<td>1</td>
<td></td>
</tr>
<tr>
<td>tipFormatter</td>
<td>Slider \u4F1A\u628A\u5F53\u524D\u503C\u4F20\u7ED9 <code>tipFormatter</code>\uFF0C\u5E76\u5728 Tooltip \u4E2D\u663E\u793A <code>tipFormatter</code> \u7684\u8FD4\u56DE\u503C\uFF0C\u82E5\u4E3A null\uFF0C\u5219\u9690\u85CF Tooltip\u3002</td>
<td>Function|null</td>
<td>IDENTITY</td>
<td></td>
</tr>
<tr>
<td>tooltipPlacement</td>
<td>\u8BBE\u7F6E Tooltip \u5C55\u793A\u4F4D\u7F6E\u3002\u53C2\u8003 <a href="/components/tooltip/"><code>Tooltip</code></a>\u3002</td>
<td>string</td>
<td></td>
<td>1.5.0</td>
</tr>
<tr>
<td>tooltipVisible</td>
<td>\u503C\u4E3A<code>true</code>\u65F6\uFF0CTooltip \u5C06\u4F1A\u59CB\u7EC8\u663E\u793A\uFF1B\u5426\u5219\u59CB\u7EC8\u4E0D\u663E\u793A\uFF0C\u54EA\u6015\u5728\u62D6\u62FD\u53CA\u79FB\u5165\u65F6\u3002</td>
<td>Boolean</td>
<td></td>
<td></td>
</tr>
<tr>
<td>value(v-model)</td>
<td>\u8BBE\u7F6E\u5F53\u524D\u53D6\u503C\u3002\u5F53 <code>range</code> \u4E3A <code>false</code> \u65F6\uFF0C\u4F7F\u7528 <code>number</code>\uFF0C\u5426\u5219\u7528 <code>[number, number]</code></td>
<td>number|number[]</td>
<td></td>
<td></td>
</tr>
<tr>
<td>vertical</td>
<td>\u503C\u4E3A <code>true</code> \u65F6\uFF0CSlider \u4E3A\u5782\u76F4\u65B9\u5411</td>
<td>Boolean</td>
<td>false</td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>\u4E8B\u4EF6\u540D\u79F0</th>
<th>\u8BF4\u660E</th>
<th>\u56DE\u8C03\u53C2\u6570</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>\u5F53 Slider \u7684\u503C\u53D1\u751F\u6539\u53D8\u65F6\uFF0C\u4F1A\u89E6\u53D1 change \u4E8B\u4EF6\uFF0C\u5E76\u628A\u6539\u53D8\u540E\u7684\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002</td>
<td>Function(value)</td>
<td>NOOP</td>
</tr>
<tr>
<td>afterChange</td>
<td>\u4E0E <code>mouseup</code> \u89E6\u53D1\u65F6\u673A\u4E00\u81F4\uFF0C\u628A\u5F53\u524D\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002</td>
<td>Function(value)</td>
<td>NOOP</td>
</tr>
</tbody>
</table>
<h2 id="\u65B9\u6CD5">\u65B9\u6CD5 <a class="header-anchor" href="#\u65B9\u6CD5">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<table>
<thead>
<tr>
<th>\u540D\u79F0</th>
<th>\u63CF\u8FF0</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur()</td>
<td>\u79FB\u9664\u7126\u70B9</td>
</tr>
<tr>
<td>focus()</td>
<td>\u83B7\u53D6\u7126\u70B9</td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060301205}},hn={class:"markdown"};function yn(t,s,k,g,C,m){return d(),I("article",hn,s[0]||(s[0]=[B('<p>\u6ED1\u52A8\u578B\u8F93\u5165\u5668\uFF0C\u5C55\u793A\u5F53\u524D\u503C\u548C\u53EF\u9009\u8303\u56F4\u3002</p><h2 id="\u4F55\u65F6\u4F7F\u7528">\u4F55\u65F6\u4F7F\u7528 <a class="header-anchor" href="#\u4F55\u65F6\u4F7F\u7528"><span aria-hidden="true" class="anchor">#</span></a></h2><p>\u5F53\u7528\u6237\u9700\u8981\u5728\u6570\u503C\u533A\u95F4/\u81EA\u5B9A\u4E49\u533A\u95F4\u5185\u8FDB\u884C\u9009\u62E9\u65F6\uFF0C\u53EF\u4E3A\u8FDE\u7EED\u6216\u79BB\u6563\u503C\u3002</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>\u53C2\u6570</th><th>\u8BF4\u660E</th><th>\u7C7B\u578B</th><th>\u9ED8\u8BA4\u503C</th><th>\u7248\u672C</th></tr></thead><tbody><tr><td>autofocus</td><td>\u81EA\u52A8\u83B7\u53D6\u7126\u70B9</td><td>boolean</td><td>false</td><td></td></tr><tr><td>disabled</td><td>\u503C\u4E3A <code>true</code> \u65F6\uFF0C\u6ED1\u5757\u4E3A\u7981\u7528\u72B6\u6001</td><td>boolean</td><td>false</td><td></td></tr><tr><td>dots</td><td>\u662F\u5426\u53EA\u80FD\u62D6\u62FD\u5230\u523B\u5EA6\u4E0A</td><td>boolean</td><td>false</td><td></td></tr><tr><td>getTooltipPopupContainer</td><td>Tooltip \u6E32\u67D3\u7236\u8282\u70B9\uFF0C\u9ED8\u8BA4\u6E32\u67D3\u5230 body \u4E0A\u3002</td><td>Function</td><td>() =&gt; document.body</td><td>1.5.0</td></tr><tr><td>included</td><td><code>marks</code> \u4E0D\u4E3A\u7A7A\u5BF9\u8C61\u65F6\u6709\u6548\uFF0C\u503C\u4E3A true \u65F6\u8868\u793A\u503C\u4E3A\u5305\u542B\u5173\u7CFB\uFF0Cfalse \u8868\u793A\u5E76\u5217</td><td>boolean</td><td>true</td><td></td></tr><tr><td>mark</td><td>\u81EA\u5B9A\u4E49\u523B\u5EA6\u6807\u8BB0</td><td>v-slot:mark</td><td>{ point: number, label: any }</td><td>3.0</td></tr><tr><td>marks</td><td>\u523B\u5EA6\u6807\u8BB0\uFF0Ckey \u7684\u7C7B\u578B\u5FC5\u987B\u4E3A <code>number</code> \u4E14\u53D6\u503C\u5728\u95ED\u533A\u95F4 [min, max] \u5185\uFF0C\u6BCF\u4E2A\u6807\u7B7E\u53EF\u4EE5\u5355\u72EC\u8BBE\u7F6E\u6837\u5F0F</td><td>object</td><td>{ number: string|VNode } or { number: { style: object, label: string|VNode } } or { number: () =&gt; VNode }</td><td></td></tr><tr><td>max</td><td>\u6700\u5927\u503C</td><td>number</td><td>100</td><td></td></tr><tr><td>min</td><td>\u6700\u5C0F\u503C</td><td>number</td><td>0</td><td></td></tr><tr><td>range</td><td>\u53CC\u6ED1\u5757\u6A21\u5F0F</td><td>boolean</td><td>false</td><td></td></tr><tr><td>reverse</td><td>\u53CD\u5411\u5750\u6807\u8F74</td><td>boolean</td><td>false</td><td>1.5.0</td></tr><tr><td>step</td><td>\u6B65\u957F\uFF0C\u53D6\u503C\u5FC5\u987B\u5927\u4E8E 0\uFF0C\u5E76\u4E14\u53EF\u88AB (max - min) \u6574\u9664\u3002\u5F53 <code>marks</code> \u4E0D\u4E3A\u7A7A\u5BF9\u8C61\u65F6\uFF0C\u53EF\u4EE5\u8BBE\u7F6E <code>step</code> \u4E3A <code>null</code>\uFF0C\u6B64\u65F6 Slider \u7684\u53EF\u9009\u503C\u4EC5\u6709 marks \u6807\u51FA\u6765\u7684\u90E8\u5206\u3002</td><td>number|null</td><td>1</td><td></td></tr><tr><td>tipFormatter</td><td>Slider \u4F1A\u628A\u5F53\u524D\u503C\u4F20\u7ED9 <code>tipFormatter</code>\uFF0C\u5E76\u5728 Tooltip \u4E2D\u663E\u793A <code>tipFormatter</code> \u7684\u8FD4\u56DE\u503C\uFF0C\u82E5\u4E3A null\uFF0C\u5219\u9690\u85CF Tooltip\u3002</td><td>Function|null</td><td>IDENTITY</td><td></td></tr><tr><td>tooltipPlacement</td><td>\u8BBE\u7F6E Tooltip \u5C55\u793A\u4F4D\u7F6E\u3002\u53C2\u8003 <a href="/components/tooltip/"><code>Tooltip</code></a>\u3002</td><td>string</td><td></td><td>1.5.0</td></tr><tr><td>tooltipVisible</td><td>\u503C\u4E3A<code>true</code>\u65F6\uFF0CTooltip \u5C06\u4F1A\u59CB\u7EC8\u663E\u793A\uFF1B\u5426\u5219\u59CB\u7EC8\u4E0D\u663E\u793A\uFF0C\u54EA\u6015\u5728\u62D6\u62FD\u53CA\u79FB\u5165\u65F6\u3002</td><td>Boolean</td><td></td><td></td></tr><tr><td>value(v-model)</td><td>\u8BBE\u7F6E\u5F53\u524D\u53D6\u503C\u3002\u5F53 <code>range</code> \u4E3A <code>false</code> \u65F6\uFF0C\u4F7F\u7528 <code>number</code>\uFF0C\u5426\u5219\u7528 <code>[number, number]</code></td><td>number|number[]</td><td></td><td></td></tr><tr><td>vertical</td><td>\u503C\u4E3A <code>true</code> \u65F6\uFF0CSlider \u4E3A\u5782\u76F4\u65B9\u5411</td><td>Boolean</td><td>false</td><td></td></tr></tbody></table><h3 id="\u4E8B\u4EF6">\u4E8B\u4EF6 <a class="header-anchor" href="#\u4E8B\u4EF6"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>\u4E8B\u4EF6\u540D\u79F0</th><th>\u8BF4\u660E</th><th>\u56DE\u8C03\u53C2\u6570</th><th></th></tr></thead><tbody><tr><td>change</td><td>\u5F53 Slider \u7684\u503C\u53D1\u751F\u6539\u53D8\u65F6\uFF0C\u4F1A\u89E6\u53D1 change \u4E8B\u4EF6\uFF0C\u5E76\u628A\u6539\u53D8\u540E\u7684\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002</td><td>Function(value)</td><td>NOOP</td></tr><tr><td>afterChange</td><td>\u4E0E <code>mouseup</code> \u89E6\u53D1\u65F6\u673A\u4E00\u81F4\uFF0C\u628A\u5F53\u524D\u503C\u4F5C\u4E3A\u53C2\u6570\u4F20\u5165\u3002</td><td>Function(value)</td><td>NOOP</td></tr></tbody></table><h2 id="\u65B9\u6CD5">\u65B9\u6CD5 <a class="header-anchor" href="#\u65B9\u6CD5"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>\u540D\u79F0</th><th>\u63CF\u8FF0</th></tr></thead><tbody><tr><td>blur()</td><td>\u79FB\u9664\u7126\u70B9</td></tr><tr><td>focus()</td><td>\u83B7\u53D6\u7126\u70B9</td></tr></tbody></table>',9)]))}const Zn=b(An,[["render",yn]]),wn={pageData:{title:"Slider",description:"",frontmatter:{category:"Components",type:"Data Entry",title:"Slider",cover:"https://gw.alipayobjects.com/zos/alicdn/HZ3meFc6W/Silder.svg"},headers:[{level:2,title:"When To Use",slug:"When-To-Use",content:"To input a value in a range."},{level:2,title:"API",slug:"API",content:""},{level:3,title:"events",slug:"events",content:""},{level:2,title:"Methods",slug:"Methods",content:""}],relativePath:"components/slider/index.en-US.md",content:`
A Slider component for displaying current value and intervals in range.

## When To Use

To input a value in a range.

## API

| Property | Description | Type | Default | Version |
| --- | --- | --- | --- | --- |
| autofocus | get focus when component mounted | boolean | false |  |
| disabled | If true, the slider will not be interactable. | boolean | false |  |
| dots | Whether the thumb can drag over tick only. | boolean | false |  |
| getTooltipPopupContainer | The DOM container of the Tooltip, the default behavior is to create a div element in body. | Function | () =&gt; document.body | 1.5.0 |
| handleStyle | The style of slider handle | CSSProperties | - |  |
| included | Make effect when \`marks\` not null\uFF0C\`true\` means containment and \`false\` means coordinative | boolean | true |  |
| mark | Custom tick mark of Slider, | v-slot:mark | { point: number, label: any } | 3.0 |
| marks | Tick mark of Slider, type of key must be \`number\`, and must in closed interval \\[min, max], each mark can declare its own style. | object | { number: string\\|VNode } or { number: { style: object, label: string\\|VNode } } or { number: () =&gt; VNode } |  |
| max | The maximum value the slider can slide to | number | 100 |  |
| min | The minimum value the slider can slide to. | number | 0 |  |
| range | dual thumb mode | boolean | false |  |
| reverse | reverse the component | boolean | false | 1.5.0 |
| step | The granularity the slider can step through values. Must greater than 0, and be divided by (max - min) . When \`marks\` no null, \`step\` can be \`null\`. | number\\|null | 1 |  |
| tipFormatter | Slider will pass its value to \`tipFormatter\`, and display its value in Tooltip, and hide Tooltip when return value is null. | Function\\|null | IDENTITY |  |
| tooltipPlacement | Set Tooltip display position. Ref [\`Tooltip\`](/components/tooltip/). | string |  | 1.5.0 |
| tooltipVisible | If true, Tooltip will show always, or it will not show anyway, even if dragging or hovering. | Boolean |  |  |
| trackStyle | The style of slider track | CSSProperties | - |  |
| value(v-model) | The value of slider. When \`range\` is \`false\`, use \`number\`, otherwise, use \`[number, number]\` | number\\|number\\[] |  |  |
| vertical | If true, the slider will be vertical. | Boolean | false |  |

### events

| Events Name | Description | Arguments |  |
| --- | --- | --- | --- |
| change | Callback function that is fired when the user changes the slider&#39;s value. | Function(value) | NOOP |
| afterChange | Fire when \`mouseup\` is fired. | Function(value) | NOOP |

## Methods

| Name    | Description  |
| ------- | ------------ |
| blur()  | remove focus |
| focus() | get focus    |
`,html:`<p>A Slider component for displaying current value and intervals in range.</p>
<h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<p>To input a value in a range.</p>
<h2 id="API">API <a class="header-anchor" href="#API">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<table>
<thead>
<tr>
<th>Property</th>
<th>Description</th>
<th>Type</th>
<th>Default</th>
<th>Version</th>
</tr>
</thead>
<tbody>
<tr>
<td>autofocus</td>
<td>get focus when component mounted</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>disabled</td>
<td>If true, the slider will not be interactable.</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>dots</td>
<td>Whether the thumb can drag over tick only.</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>getTooltipPopupContainer</td>
<td>The DOM container of the Tooltip, the default behavior is to create a div element in body.</td>
<td>Function</td>
<td>() =&gt; document.body</td>
<td>1.5.0</td>
</tr>
<tr>
<td>handleStyle</td>
<td>The style of slider handle</td>
<td>CSSProperties</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>included</td>
<td>Make effect when <code>marks</code> not null\uFF0C<code>true</code> means containment and <code>false</code> means coordinative</td>
<td>boolean</td>
<td>true</td>
<td></td>
</tr>
<tr>
<td>mark</td>
<td>Custom tick mark of Slider,</td>
<td>v-slot:mark</td>
<td>{ point: number, label: any }</td>
<td>3.0</td>
</tr>
<tr>
<td>marks</td>
<td>Tick mark of Slider, type of key must be <code>number</code>, and must in closed interval [min, max], each mark can declare its own style.</td>
<td>object</td>
<td>{ number: string|VNode } or { number: { style: object, label: string|VNode } } or { number: () =&gt; VNode }</td>
<td></td>
</tr>
<tr>
<td>max</td>
<td>The maximum value the slider can slide to</td>
<td>number</td>
<td>100</td>
<td></td>
</tr>
<tr>
<td>min</td>
<td>The minimum value the slider can slide to.</td>
<td>number</td>
<td>0</td>
<td></td>
</tr>
<tr>
<td>range</td>
<td>dual thumb mode</td>
<td>boolean</td>
<td>false</td>
<td></td>
</tr>
<tr>
<td>reverse</td>
<td>reverse the component</td>
<td>boolean</td>
<td>false</td>
<td>1.5.0</td>
</tr>
<tr>
<td>step</td>
<td>The granularity the slider can step through values. Must greater than 0, and be divided by (max - min) . When <code>marks</code> no null, <code>step</code> can be <code>null</code>.</td>
<td>number|null</td>
<td>1</td>
<td></td>
</tr>
<tr>
<td>tipFormatter</td>
<td>Slider will pass its value to <code>tipFormatter</code>, and display its value in Tooltip, and hide Tooltip when return value is null.</td>
<td>Function|null</td>
<td>IDENTITY</td>
<td></td>
</tr>
<tr>
<td>tooltipPlacement</td>
<td>Set Tooltip display position. Ref <a href="/components/tooltip/"><code>Tooltip</code></a>.</td>
<td>string</td>
<td></td>
<td>1.5.0</td>
</tr>
<tr>
<td>tooltipVisible</td>
<td>If true, Tooltip will show always, or it will not show anyway, even if dragging or hovering.</td>
<td>Boolean</td>
<td></td>
<td></td>
</tr>
<tr>
<td>trackStyle</td>
<td>The style of slider track</td>
<td>CSSProperties</td>
<td>-</td>
<td></td>
</tr>
<tr>
<td>value(v-model)</td>
<td>The value of slider. When <code>range</code> is <code>false</code>, use <code>number</code>, otherwise, use <code>[number, number]</code></td>
<td>number|number[]</td>
<td></td>
<td></td>
</tr>
<tr>
<td>vertical</td>
<td>If true, the slider will be vertical.</td>
<td>Boolean</td>
<td>false</td>
<td></td>
</tr>
</tbody>
</table>
<h3 id="events">events <a class="header-anchor" href="#events">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h3>
<table>
<thead>
<tr>
<th>Events Name</th>
<th>Description</th>
<th>Arguments</th>
<th></th>
</tr>
</thead>
<tbody>
<tr>
<td>change</td>
<td>Callback function that is fired when the user changes the slider's value.</td>
<td>Function(value)</td>
<td>NOOP</td>
</tr>
<tr>
<td>afterChange</td>
<td>Fire when <code>mouseup</code> is fired.</td>
<td>Function(value)</td>
<td>NOOP</td>
</tr>
</tbody>
</table>
<h2 id="Methods">Methods <a class="header-anchor" href="#Methods">
          <span aria-hidden="true" class="anchor">#</span>
        </a></h2>
<table>
<thead>
<tr>
<th>Name</th>
<th>Description</th>
</tr>
</thead>
<tbody>
<tr>
<td>blur()</td>
<td>remove focus</td>
</tr>
<tr>
<td>focus()</td>
<td>get focus</td>
</tr>
</tbody>
</table>
`,lastUpdated:1748060301204}},Wn={class:"markdown"};function fn(t,s,k,g,C,m){return d(),I("article",Wn,s[0]||(s[0]=[B('<p>A Slider component for displaying current value and intervals in range.</p><h2 id="When-To-Use">When To Use <a class="header-anchor" href="#When-To-Use"><span aria-hidden="true" class="anchor">#</span></a></h2><p>To input a value in a range.</p><h2 id="API">API <a class="header-anchor" href="#API"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>Property</th><th>Description</th><th>Type</th><th>Default</th><th>Version</th></tr></thead><tbody><tr><td>autofocus</td><td>get focus when component mounted</td><td>boolean</td><td>false</td><td></td></tr><tr><td>disabled</td><td>If true, the slider will not be interactable.</td><td>boolean</td><td>false</td><td></td></tr><tr><td>dots</td><td>Whether the thumb can drag over tick only.</td><td>boolean</td><td>false</td><td></td></tr><tr><td>getTooltipPopupContainer</td><td>The DOM container of the Tooltip, the default behavior is to create a div element in body.</td><td>Function</td><td>() =&gt; document.body</td><td>1.5.0</td></tr><tr><td>handleStyle</td><td>The style of slider handle</td><td>CSSProperties</td><td>-</td><td></td></tr><tr><td>included</td><td>Make effect when <code>marks</code> not null\uFF0C<code>true</code> means containment and <code>false</code> means coordinative</td><td>boolean</td><td>true</td><td></td></tr><tr><td>mark</td><td>Custom tick mark of Slider,</td><td>v-slot:mark</td><td>{ point: number, label: any }</td><td>3.0</td></tr><tr><td>marks</td><td>Tick mark of Slider, type of key must be <code>number</code>, and must in closed interval [min, max], each mark can declare its own style.</td><td>object</td><td>{ number: string|VNode } or { number: { style: object, label: string|VNode } } or { number: () =&gt; VNode }</td><td></td></tr><tr><td>max</td><td>The maximum value the slider can slide to</td><td>number</td><td>100</td><td></td></tr><tr><td>min</td><td>The minimum value the slider can slide to.</td><td>number</td><td>0</td><td></td></tr><tr><td>range</td><td>dual thumb mode</td><td>boolean</td><td>false</td><td></td></tr><tr><td>reverse</td><td>reverse the component</td><td>boolean</td><td>false</td><td>1.5.0</td></tr><tr><td>step</td><td>The granularity the slider can step through values. Must greater than 0, and be divided by (max - min) . When <code>marks</code> no null, <code>step</code> can be <code>null</code>.</td><td>number|null</td><td>1</td><td></td></tr><tr><td>tipFormatter</td><td>Slider will pass its value to <code>tipFormatter</code>, and display its value in Tooltip, and hide Tooltip when return value is null.</td><td>Function|null</td><td>IDENTITY</td><td></td></tr><tr><td>tooltipPlacement</td><td>Set Tooltip display position. Ref <a href="/components/tooltip/"><code>Tooltip</code></a>.</td><td>string</td><td></td><td>1.5.0</td></tr><tr><td>tooltipVisible</td><td>If true, Tooltip will show always, or it will not show anyway, even if dragging or hovering.</td><td>Boolean</td><td></td><td></td></tr><tr><td>trackStyle</td><td>The style of slider track</td><td>CSSProperties</td><td>-</td><td></td></tr><tr><td>value(v-model)</td><td>The value of slider. When <code>range</code> is <code>false</code>, use <code>number</code>, otherwise, use <code>[number, number]</code></td><td>number|number[]</td><td></td><td></td></tr><tr><td>vertical</td><td>If true, the slider will be vertical.</td><td>Boolean</td><td>false</td><td></td></tr></tbody></table><h3 id="events">events <a class="header-anchor" href="#events"><span aria-hidden="true" class="anchor">#</span></a></h3><table><thead><tr><th>Events Name</th><th>Description</th><th>Arguments</th><th></th></tr></thead><tbody><tr><td>change</td><td>Callback function that is fired when the user changes the slider&#39;s value.</td><td>Function(value)</td><td>NOOP</td></tr><tr><td>afterChange</td><td>Fire when <code>mouseup</code> is fired.</td><td>Function(value)</td><td>NOOP</td></tr></tbody></table><h2 id="Methods">Methods <a class="header-anchor" href="#Methods"><span aria-hidden="true" class="anchor">#</span></a></h2><table><thead><tr><th>Name</th><th>Description</th></tr></thead><tbody><tr><td>blur()</td><td>remove focus</td></tr><tr><td>focus()</td><td>get focus</td></tr></tbody></table>',9)]))}const Bn=b(wn,[["render",fn]]),Gn=A({CN:Zn,US:Bn,components:{Basic:X,InputNumber:K,IconSlider:j,TipFormatter:L,Event:O,Mark:en,Vertical:dn,ShowTooltip:Cn,Reverse:vn},setup(){return{}}});function Vn(t,s,k,g,C,m){const l=p("Basic"),r=p("InputNumber"),o=p("IconSlider"),u=p("TipFormatter"),Z=p("Event"),y=p("Mark"),G=p("Vertical"),V=p("ShowTooltip"),F=p("Reverse"),x=p("demo-sort");return d(),h(x,null,{default:c(()=>[e(l),e(r),e(o),e(u),e(Z),e(y),e(G),e(V),e(F)]),_:1})}const Yn=b(Gn,[["render",Vn]]);export{Yn as default};