https://openwritings.net/_next/static/chunks/pages/postx/p/reactjs…k-function-handler-demo-5b5c75b52f71008d.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[543],{51049:function(e,t,n){(window.__NEXT_P=window.__NEXT_P||[]).push(["/postx/p/reactjs/onclick-function-handler-demo",function(){return n(33011)}])},76720:function(e,t,n){"use strict";var l=n(93967),s=n.n(l),a=n(67294),r=n(70861),c=n(97400),o=n(85893);let i=a.forwardRef((e,t)=>{let{as:n,bsPrefix:l,variant:a="primary",size:i,active:u=!1,disabled:f=!1,className:d,...p}=e,h=(0,c.vE)(l,"btn"),[y,{tagName:$}]=(0,r.FT)({tagName:n,disabled:f,...p});return(0,o.jsx)($,{...y,...p,ref:t,disabled:f,className:s()(d,h,u&&"active",a&&`${h}-${a}`,i&&`${h}-${i}`,p.href&&f&&"disabled")})});i.displayName="Button",t.Z=i},68070:function(e,t,n){"use strict";var l=n(93967),s=n.n(l),a=n(67294),r=n(97400),c=n(85893);let o=a.forwardRef((e,t)=>{let[{className:n,...l},{as:a="div",bsPrefix:o,spans:i}]=function(e){let{as:t,bsPrefix:n,className:l,...a}=e;n=(0,r.vE)(n,"col");let c=(0,r.pi)(),o=(0,r.zG)(),i=[],u=[];return c.forEach(e=>{let t,l,s;let r=a[e];delete a[e],"object"==typeof r&&null!=r?{span:t,offset:l,order:s}=r:t=r;let c=e!==o?`-${e}`:"";t&&i.push(!0===t?`${n}${c}`:`${n}${c}-${t}`),null!=s&&u.push(`order${c}-${s}`),null!=l&&u.push(`offset${c}-${l}`)}),[{...a,className:s()(l,...i,...u)},{as:t,bsPrefix:n,spans:i}]}(e);return(0,c.jsx)(a,{...l,ref:t,className:s()(n,!i.length&&o)})});o.displayName="Col",t.Z=o},19101:function(e,t,n){"use strict";var l=n(93967),s=n.n(l),a=n(67294),r=n(97400),c=n(85893);let o=a.forwardRef((e,t)=>{let{bsPrefix:n,className:l,as:a="div",...o}=e,i=(0,r.vE)(n,"row"),u=(0,r.pi)(),f=(0,r.zG)(),d=`${i}-cols`,p=[];return u.forEach(e=>{let t;let n=o[e];delete o[e],null!=n&&"object"==typeof n?{cols:t}=n:t=n;let l=e!==f?`-${e}`:"";null!=t&&p.push(`${d}${l}-${t}`)}),(0,c.jsx)(a,{ref:t,...o,className:s()(l,i,...p)})});o.displayName="Row",t.Z=o},33011:function(e,t,n){"use strict";n.r(t),n.d(t,{default:function(){return i}});var l=n(85893),s=n(67294);n(41664),n(9008);var a=n(97375),r=n(19101),c=n(68070),o=n(76720);function i(){let[e,t]=(0,s.useState)(!0);async function n(){await f(),t(!0)}async function i(){await d(),t(!1)}(0,s.useEffect)(()=>{(async()=>{try{let e=await u();t(e)}catch(e){console.log("Error occured when getPlayState()",e)}})()},[]);let p={fontSize:"2rem",paddingLeft:"5rem",paddingRight:"5rem"};return(0,l.jsx)(a.Z,{children:(0,l.jsxs)(r.Z,{children:[(0,l.jsx)(c.Z,{children:(0,l.jsx)(o.Z,{style:p,variant:"danger",onClick:()=>i(),disabled:!e,children:" Stop "})}),(0,l.jsx)(c.Z,{children:(0,l.jsx)(o.Z,{style:p,variant:"success",onClick:()=>n(),disabled:e,children:" PLay "})})]})})}async function u(){return console.log("getPlayState()"),!0}async function f(){console.log("play()")}async function d(){console.log("stop()")}},9008:function(e,t,n){e.exports=n(23867)}},function(e){e.O(0,[1664,2888,9774,179],function(){return e(e.s=51049)}),_N_E=e.O()}]);