基於react的audio元件

樣式請自己定義哦~

需要其他功能請自行新增！

// 元件呼叫

stalled當瀏覽器嘗試獲取**資料，但資料不可用時

suspend當瀏覽器刻意不獲取**資料時

volumechange當音量已更改時

this.controlaudio('alltime')}

ontimeupdate=
>
您的瀏覽器不支援 audio 標籤。
this.controlaudio(isplay ? 'pause' : 'play')}
/>
this.controlaudio('changecurrenttime',value)} 
/>
this.controlaudio('muted')}
/>
this.controlaudio('changevolume',value)} 
value= 
/>

constructor(props) 

}  millisecondtodate(time) :$:$`
// }
return `$:$`}`
}  controlaudio(type,value)  = this.props
const audio = document.getelementbyid(`audio$`)
switch(type) )
break
case 'play':
audio.play()
this.setstate()
break
case 'pause':
audio.pause()
this.setstate()
break
case 'muted':
this.setstate()
audio.muted = !audio.muted
break
case 'changecurrenttime':
this.setstate()
audio.currenttime = value
if(value == audio.duration) )
}break
case 'getcurrenttime':
this.setstate()
if(audio.currenttime == audio.duration) )
}break
case 'changevolume':
audio.volume = value / 100
this.setstate()
break  
}}

基於react的高度過渡元件

開發中，最麻煩的過渡效果就是高度過渡。因為過渡效果需要設定乙個起始狀態和結束狀態，但是對於web中的元素來說，容器高度大部分是根據內部元素自動撐起來的，這時很難去設定乙個穩定的過渡高度。所以我寫了乙個基於react的元件來自動完成高度過渡這一實現。使用方法 首先npm install react a...

小程式開發之元件audio（音訊）

音訊。注意 1.6.0 版本開始，該元件不再維護。建議使用能力更強的 wx.createinneraudiocontext 介面 例如 效果展示 index.wxml audio音訊 進度暫停 index.wxss audio title audio slider button index.js p...

react的高階元件

1 什麼是高階元件？2 侵入式import react from react import loding from common loading 侵入式 因為要訪問它的內部狀態，所以要用到繼承，繼承他的父級 export default wrapcomponent else 3 非侵入式 hoc w...