[{"data":1,"prerenderedAt":976},["ShallowReactive",2],{"content-\u002Fcomponents\u002Fbutton":3,"content-en-fallback-\u002Fcomponents\u002Fbutton":975},{"id":4,"title":5,"body":6,"description":16,"extension":967,"meta":968,"nav":969,"navigation":970,"path":971,"seo":972,"stem":973,"__hash__":974},"content\u002Fcomponents\u002Fbutton.md","Button 按钮",{"type":7,"value":8,"toc":958},"minimark",[9,13,17,21,158,161,236,239,314,317,432,436,551,554,611,615,868,914,954],[10,11,5],"h1",{"id":12},"button-按钮",[14,15,16],"p",{},"按钮组件，用于触发操作。",[18,19,20],"h2",{"id":20},"外观变体",[22,23,24,31],"demo-block",{"title":20},[25,26,28],"template",{"v-slot:preview":27},"",[29,30],"button-appearance-demo",{},[25,32,33],{"v-slot:code":27},[34,35,39],"pre",{"className":36,"code":37,"language":38,"meta":27,"style":27},"language-vue shiki shiki-themes github-light github-dark","\u003CFluereButton appearance=\"primary\">Primary\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"secondary\">Secondary\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"outline\">Outline\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"subtle\">Subtle\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"transparent\">Transparent\u003C\u002FFluereButton>\n","vue",[40,41,42,74,95,116,137],"code",{"__ignoreMap":27},[43,44,47,51,55,59,62,66,69,71],"span",{"class":45,"line":46},"line",1,[43,48,50],{"class":49},"sVt8B","\u003C",[43,52,54],{"class":53},"s9eBZ","FluereButton",[43,56,58],{"class":57},"sScJk"," appearance",[43,60,61],{"class":49},"=",[43,63,65],{"class":64},"sZZnC","\"primary\"",[43,67,68],{"class":49},">Primary\u003C\u002F",[43,70,54],{"class":53},[43,72,73],{"class":49},">\n",[43,75,77,79,81,83,85,88,91,93],{"class":45,"line":76},2,[43,78,50],{"class":49},[43,80,54],{"class":53},[43,82,58],{"class":57},[43,84,61],{"class":49},[43,86,87],{"class":64},"\"secondary\"",[43,89,90],{"class":49},">Secondary\u003C\u002F",[43,92,54],{"class":53},[43,94,73],{"class":49},[43,96,98,100,102,104,106,109,112,114],{"class":45,"line":97},3,[43,99,50],{"class":49},[43,101,54],{"class":53},[43,103,58],{"class":57},[43,105,61],{"class":49},[43,107,108],{"class":64},"\"outline\"",[43,110,111],{"class":49},">Outline\u003C\u002F",[43,113,54],{"class":53},[43,115,73],{"class":49},[43,117,119,121,123,125,127,130,133,135],{"class":45,"line":118},4,[43,120,50],{"class":49},[43,122,54],{"class":53},[43,124,58],{"class":57},[43,126,61],{"class":49},[43,128,129],{"class":64},"\"subtle\"",[43,131,132],{"class":49},">Subtle\u003C\u002F",[43,134,54],{"class":53},[43,136,73],{"class":49},[43,138,140,142,144,146,148,151,154,156],{"class":45,"line":139},5,[43,141,50],{"class":49},[43,143,54],{"class":53},[43,145,58],{"class":57},[43,147,61],{"class":49},[43,149,150],{"class":64},"\"transparent\"",[43,152,153],{"class":49},">Transparent\u003C\u002F",[43,155,54],{"class":53},[43,157,73],{"class":49},[18,159,160],{"id":160},"尺寸",[22,162,163,168],{"title":160},[25,164,165],{"v-slot:preview":27},[166,167],"button-size-demo",{},[25,169,170],{"v-slot:code":27},[34,171,173],{"className":36,"code":172,"language":38,"meta":27,"style":27},"\u003CFluereButton size=\"small\">Small\u003C\u002FFluereButton>\n\u003CFluereButton size=\"medium\">Medium\u003C\u002FFluereButton>\n\u003CFluereButton size=\"large\">Large\u003C\u002FFluereButton>\n",[40,174,175,196,216],{"__ignoreMap":27},[43,176,177,179,181,184,186,189,192,194],{"class":45,"line":46},[43,178,50],{"class":49},[43,180,54],{"class":53},[43,182,183],{"class":57}," size",[43,185,61],{"class":49},[43,187,188],{"class":64},"\"small\"",[43,190,191],{"class":49},">Small\u003C\u002F",[43,193,54],{"class":53},[43,195,73],{"class":49},[43,197,198,200,202,204,206,209,212,214],{"class":45,"line":76},[43,199,50],{"class":49},[43,201,54],{"class":53},[43,203,183],{"class":57},[43,205,61],{"class":49},[43,207,208],{"class":64},"\"medium\"",[43,210,211],{"class":49},">Medium\u003C\u002F",[43,213,54],{"class":53},[43,215,73],{"class":49},[43,217,218,220,222,224,226,229,232,234],{"class":45,"line":97},[43,219,50],{"class":49},[43,221,54],{"class":53},[43,223,183],{"class":57},[43,225,61],{"class":49},[43,227,228],{"class":64},"\"large\"",[43,230,231],{"class":49},">Large\u003C\u002F",[43,233,54],{"class":53},[43,235,73],{"class":49},[18,237,238],{"id":238},"形状",[22,240,241,246],{"title":238},[25,242,243],{"v-slot:preview":27},[244,245],"button-shape-demo",{},[25,247,248],{"v-slot:code":27},[34,249,251],{"className":36,"code":250,"language":38,"meta":27,"style":27},"\u003CFluereButton shape=\"rounded\">Rounded\u003C\u002FFluereButton>\n\u003CFluereButton shape=\"circular\">Circular\u003C\u002FFluereButton>\n\u003CFluereButton shape=\"square\">Square\u003C\u002FFluereButton>\n",[40,252,253,274,294],{"__ignoreMap":27},[43,254,255,257,259,262,264,267,270,272],{"class":45,"line":46},[43,256,50],{"class":49},[43,258,54],{"class":53},[43,260,261],{"class":57}," shape",[43,263,61],{"class":49},[43,265,266],{"class":64},"\"rounded\"",[43,268,269],{"class":49},">Rounded\u003C\u002F",[43,271,54],{"class":53},[43,273,73],{"class":49},[43,275,276,278,280,282,284,287,290,292],{"class":45,"line":76},[43,277,50],{"class":49},[43,279,54],{"class":53},[43,281,261],{"class":57},[43,283,61],{"class":49},[43,285,286],{"class":64},"\"circular\"",[43,288,289],{"class":49},">Circular\u003C\u002F",[43,291,54],{"class":53},[43,293,73],{"class":49},[43,295,296,298,300,302,304,307,310,312],{"class":45,"line":97},[43,297,50],{"class":49},[43,299,54],{"class":53},[43,301,261],{"class":57},[43,303,61],{"class":49},[43,305,306],{"class":64},"\"square\"",[43,308,309],{"class":49},">Square\u003C\u002F",[43,311,54],{"class":53},[43,313,73],{"class":49},[18,315,316],{"id":316},"禁用状态",[22,318,319,324],{"title":316},[25,320,321],{"v-slot:preview":27},[322,323],"button-disabled-demo",{},[25,325,326],{"v-slot:code":27},[34,327,329],{"className":36,"code":328,"language":38,"meta":27,"style":27},"\u003CFluereButton appearance=\"primary\" disabled>Primary\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"secondary\" disabled>Secondary\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"outline\" disabled>Outline\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"subtle\" disabled>Subtle\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"transparent\" disabled>Transparent\u003C\u002FFluereButton>\n",[40,330,331,352,372,392,412],{"__ignoreMap":27},[43,332,333,335,337,339,341,343,346,348,350],{"class":45,"line":46},[43,334,50],{"class":49},[43,336,54],{"class":53},[43,338,58],{"class":57},[43,340,61],{"class":49},[43,342,65],{"class":64},[43,344,345],{"class":57}," disabled",[43,347,68],{"class":49},[43,349,54],{"class":53},[43,351,73],{"class":49},[43,353,354,356,358,360,362,364,366,368,370],{"class":45,"line":76},[43,355,50],{"class":49},[43,357,54],{"class":53},[43,359,58],{"class":57},[43,361,61],{"class":49},[43,363,87],{"class":64},[43,365,345],{"class":57},[43,367,90],{"class":49},[43,369,54],{"class":53},[43,371,73],{"class":49},[43,373,374,376,378,380,382,384,386,388,390],{"class":45,"line":97},[43,375,50],{"class":49},[43,377,54],{"class":53},[43,379,58],{"class":57},[43,381,61],{"class":49},[43,383,108],{"class":64},[43,385,345],{"class":57},[43,387,111],{"class":49},[43,389,54],{"class":53},[43,391,73],{"class":49},[43,393,394,396,398,400,402,404,406,408,410],{"class":45,"line":118},[43,395,50],{"class":49},[43,397,54],{"class":53},[43,399,58],{"class":57},[43,401,61],{"class":49},[43,403,129],{"class":64},[43,405,345],{"class":57},[43,407,132],{"class":49},[43,409,54],{"class":53},[43,411,73],{"class":49},[43,413,414,416,418,420,422,424,426,428,430],{"class":45,"line":139},[43,415,50],{"class":49},[43,417,54],{"class":53},[43,419,58],{"class":57},[43,421,61],{"class":49},[43,423,150],{"class":64},[43,425,345],{"class":57},[43,427,153],{"class":49},[43,429,54],{"class":53},[43,431,73],{"class":49},[18,433,435],{"id":434},"选中状态toggle","选中状态（Toggle）",[22,437,438,443],{"title":435},[25,439,440],{"v-slot:preview":27},[441,442],"button-selected-demo",{},[25,444,445],{"v-slot:code":27},[34,446,448],{"className":36,"code":447,"language":38,"meta":27,"style":27},"\u003CFluereButton appearance=\"primary\" selected>Primary\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"secondary\" selected>Secondary\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"outline\" selected>Outline\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"subtle\" selected>Subtle\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"transparent\" selected>Transparent\u003C\u002FFluereButton>\n",[40,449,450,471,491,511,531],{"__ignoreMap":27},[43,451,452,454,456,458,460,462,465,467,469],{"class":45,"line":46},[43,453,50],{"class":49},[43,455,54],{"class":53},[43,457,58],{"class":57},[43,459,61],{"class":49},[43,461,65],{"class":64},[43,463,464],{"class":57}," selected",[43,466,68],{"class":49},[43,468,54],{"class":53},[43,470,73],{"class":49},[43,472,473,475,477,479,481,483,485,487,489],{"class":45,"line":76},[43,474,50],{"class":49},[43,476,54],{"class":53},[43,478,58],{"class":57},[43,480,61],{"class":49},[43,482,87],{"class":64},[43,484,464],{"class":57},[43,486,90],{"class":49},[43,488,54],{"class":53},[43,490,73],{"class":49},[43,492,493,495,497,499,501,503,505,507,509],{"class":45,"line":97},[43,494,50],{"class":49},[43,496,54],{"class":53},[43,498,58],{"class":57},[43,500,61],{"class":49},[43,502,108],{"class":64},[43,504,464],{"class":57},[43,506,111],{"class":49},[43,508,54],{"class":53},[43,510,73],{"class":49},[43,512,513,515,517,519,521,523,525,527,529],{"class":45,"line":118},[43,514,50],{"class":49},[43,516,54],{"class":53},[43,518,58],{"class":57},[43,520,61],{"class":49},[43,522,129],{"class":64},[43,524,464],{"class":57},[43,526,132],{"class":49},[43,528,54],{"class":53},[43,530,73],{"class":49},[43,532,533,535,537,539,541,543,545,547,549],{"class":45,"line":139},[43,534,50],{"class":49},[43,536,54],{"class":53},[43,538,58],{"class":57},[43,540,61],{"class":49},[43,542,150],{"class":64},[43,544,464],{"class":57},[43,546,153],{"class":49},[43,548,54],{"class":53},[43,550,73],{"class":49},[18,552,553],{"id":553},"块级按钮",[22,555,556,561],{"title":553},[25,557,558],{"v-slot:preview":27},[559,560],"button-block-demo",{},[25,562,563],{"v-slot:code":27},[34,564,566],{"className":36,"code":565,"language":38,"meta":27,"style":27},"\u003CFluereButton appearance=\"primary\" block>Block Primary\u003C\u002FFluereButton>\n\u003CFluereButton appearance=\"secondary\" block>Block Secondary\u003C\u002FFluereButton>\n",[40,567,568,590],{"__ignoreMap":27},[43,569,570,572,574,576,578,580,583,586,588],{"class":45,"line":46},[43,571,50],{"class":49},[43,573,54],{"class":53},[43,575,58],{"class":57},[43,577,61],{"class":49},[43,579,65],{"class":64},[43,581,582],{"class":57}," block",[43,584,585],{"class":49},">Block Primary\u003C\u002F",[43,587,54],{"class":53},[43,589,73],{"class":49},[43,591,592,594,596,598,600,602,604,607,609],{"class":45,"line":76},[43,593,50],{"class":49},[43,595,54],{"class":53},[43,597,58],{"class":57},[43,599,61],{"class":49},[43,601,87],{"class":64},[43,603,582],{"class":57},[43,605,606],{"class":49},">Block Secondary\u003C\u002F",[43,608,54],{"class":53},[43,610,73],{"class":49},[18,612,614],{"id":613},"api","API",[616,617,618,637],"table",{},[619,620,621],"thead",{},[622,623,624,628,631,634],"tr",{},[625,626,627],"th",{},"属性（Props）",[625,629,630],{},"类型",[625,632,633],{},"默认",[625,635,636],{},"说明",[638,639,640,665,685,717,737,758,776,803,827,847],"tbody",{},[622,641,642,648,653,658],{},[643,644,645],"td",{},[40,646,647],{},"appearance",[643,649,650],{},[40,651,652],{},"'primary' | 'secondary' | 'outline' | 'subtle' | 'transparent'",[643,654,655],{},[40,656,657],{},"'secondary'",[643,659,660,661,664],{},"外观变体；",[40,662,663],{},"primary"," 为品牌色填充的主要行动点",[622,666,667,672,677,682],{},[643,668,669],{},[40,670,671],{},"size",[643,673,674],{},[40,675,676],{},"'small' | 'medium' | 'large'",[643,678,679],{},[40,680,681],{},"'medium'",[643,683,684],{},"尺寸，高度分别为 24 \u002F 32 \u002F 40 px",[622,686,687,692,697,702],{},[643,688,689],{},[40,690,691],{},"shape",[643,693,694],{},[40,695,696],{},"'rounded' | 'circular' | 'square'",[643,698,699],{},[40,700,701],{},"'rounded'",[643,703,704,705,708,709,712,713,716],{},"形状；",[40,706,707],{},"circular"," 取 ",[40,710,711],{},"borderRadiusCircular","，",[40,714,715],{},"square"," 为直角",[622,718,719,724,729,734],{},[643,720,721],{},[40,722,723],{},"disabled",[643,725,726],{},[40,727,728],{},"boolean",[643,730,731],{},[40,732,733],{},"false",[643,735,736],{},"是否禁用",[622,738,739,744,748,752],{},[643,740,741],{},[40,742,743],{},"selected",[643,745,746],{},[40,747,728],{},[643,749,750],{},[40,751,733],{},[643,753,754,755],{},"选中态（Toggle button 模式），渲染为 ",[40,756,757],{},"aria-pressed",[622,759,760,765,769,773],{},[643,761,762],{},[40,763,764],{},"block",[643,766,767],{},[40,768,728],{},[643,770,771],{},[40,772,733],{},[643,774,775],{},"块级显示，占满父容器宽度",[622,777,778,783,788,793],{},[643,779,780],{},[40,781,782],{},"type",[643,784,785],{},[40,786,787],{},"'button' | 'submit' | 'reset'",[643,789,790],{},[40,791,792],{},"'button'",[643,794,795,796,798,799,802],{},"原生 ",[40,797,782],{},"；显式默认 ",[40,800,801],{},"button","，避免在表单里意外触发提交",[622,804,805,810,815,820],{},[643,806,807],{},[40,808,809],{},"icon",[643,811,812],{},[40,813,814],{},"Component",[643,816,817],{},[40,818,819],{},"—",[643,821,822,823,826],{},"图标组件（",[40,824,825],{},"@fluere-vue\u002Ficons"," 的图标），装饰性、对 AT 隐藏",[622,828,829,834,839,844],{},[643,830,831],{},[40,832,833],{},"iconPosition",[643,835,836],{},[40,837,838],{},"'before' | 'after'",[643,840,841],{},[40,842,843],{},"'before'",[643,845,846],{},"图标相对文本的位置（仅图标 + 文本模式生效）",[622,848,849,854,858,862],{},[643,850,851],{},[40,852,853],{},"iconOnly",[643,855,856],{},[40,857,728],{},[643,859,860],{},[40,861,733],{},[643,863,864,865],{},"仅显示图标（等比紧凑模式），此时不渲染内容 ",[40,866,867],{},"\u003Cspan>",[616,869,870,879],{},[619,871,872],{},[622,873,874,877],{},[625,875,876],{},"插槽（Slots）",[625,878,636],{},[638,880,881,898],{},[622,882,883,888],{},[643,884,885],{},[40,886,887],{},"default",[643,889,890,891,893,894,897],{},"按钮文本；",[40,892,853],{}," 为 ",[40,895,896],{},"true"," 时不渲染",[622,899,900,904],{},[643,901,902],{},[40,903,809],{},[643,905,906,907,909,910,913],{},"图标位；提供后取代 ",[40,908,809],{}," Prop（图标会带上 ",[40,911,912],{},"aria-hidden=\"true\"","）",[915,916,917],"blockquote",{},[14,918,919,920,923,924,927,928,931,932,935,936,935,939,942,943,946,947,949,950,953],{},"本组件不声明 ",[40,921,922],{},"emits","、也不设置 ",[40,925,926],{},"inheritAttrs: false","：",[40,929,930],{},"click"," 等事件与 ",[40,933,934],{},"aria-*","、",[40,937,938],{},"id",[40,940,941],{},"title"," 等属性直接落到根节点原生 ",[40,944,945],{},"\u003Cbutton>"," 上，消费方按原生按钮的用法传即可。这也是 ",[40,948,853],{}," 场景下需要消费方自行传 ",[40,951,952],{},"aria-label"," 的原因——图标对无障碍树不可见，可访问名只能来自外部。",[955,956,957],"style",{},"html pre.shiki code .sVt8B, html code.shiki .sVt8B{--shiki-default:#24292E;--shiki-dark:#E1E4E8}html pre.shiki code .s9eBZ, html code.shiki .s9eBZ{--shiki-default:#22863A;--shiki-dark:#85E89D}html pre.shiki code .sScJk, html code.shiki .sScJk{--shiki-default:#6F42C1;--shiki-dark:#B392F0}html pre.shiki code .sZZnC, html code.shiki .sZZnC{--shiki-default:#032F62;--shiki-dark:#9ECBFF}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":27,"searchDepth":76,"depth":76,"links":959},[960,961,962,963,964,965,966],{"id":20,"depth":76,"text":20},{"id":160,"depth":76,"text":160},{"id":238,"depth":76,"text":238},{"id":316,"depth":76,"text":316},{"id":434,"depth":76,"text":435},{"id":553,"depth":76,"text":553},{"id":613,"depth":76,"text":614},"md",{},{"title":5},true,"\u002Fcomponents\u002Fbutton",{"title":5,"description":16},"components\u002Fbutton","xXLG1hZSGcPWB8WPsufbM9UN3eSUvamLjKF34ZP1M8c",null,1791802959782]