#### `chatbox js聊天輸入框`
[預覽](https://aui-js.github.io/aui/pages/api/plugs/chatbox.html) </br>
參數 | 類型 | 描述 | 默認值 | 必選
---- | ----- | ------ | ----- | ----
warp | string | 父容器元素 | 'body' | 否
mask | boolean | 是否顯示遮罩蒙版 | true | 否
touchClose | boolean | 觸摸遮罩是否關閉側滑菜單 | true | 否
autoFocus | boolean | 是否自動獲取焦點 | false | 否
events | arr | 配置監聽事件(錄音，選擇附加功能...等事件監聽) | [] | 否
record | object | 錄音功能配置 | record: </br>{ </br>use: true, //是否開啟錄音功能 </br>MIN_SOUND_TIME: 800 //錄音最短時間限制 </br>} | 否
emotion | object | 表情功能配置 | emotion: </br>{ </br>use: true, //是否開啟表情功能 </br>path: '' //.json文件路徑 </br>pageHasNum: 27, //一頁顯示按鈕數量(7 * 4 - 1) </br>} | 否
extras | object | 附加功能配置 | extras: </br>{</br> use: true, //是否開啟附加功能 </br> pageHasNum: 8, //一頁顯示按鈕數量(4 * 2) </br> btns: [ /* {title: '', icon: '', img: ''} */],</br> }
````html
<link rel="stylesheet" type="text/css" href="https://aui-js.github.io/aui/static/css/aui.min.css"/>
<link rel="stylesheet" type="text/css" href="https://aui-js.github.io/aui/static/css/aui.chatbox.css"/>
<script type="text/javascript" src="https://aui-js.github.io/aui/static/js/aui.min.js"></script>
<script type="text/javascript" src="https://aui-js.github.io/aui/static/js/aui.chatbox.js"></script>
````
> 示例：
````javascript
aui.chatbox.init({
warp: 'body',
autoFocus: true,
record: {
use: true,
},
emotion: {
use: true,
path: '../../img/chat/emotion/',
file: 'emotion.json'
},
extras: {
use: true,
btns: [
{title: '相冊', icon: 'iconimage'},
{title: '拍攝', icon: 'iconcamera_fill'},
{title: '語音通話', icon: 'iconvideo_fill'},
{title: '位置', icon: 'iconaddress1'},
{title: '紅包', icon: 'iconredpacket_fill'},
{title: '語音輸入', icon: 'icontranslation_fill'},
{title: '我的收藏', icon: 'iconcollection_fill'},
{title: '名片', icon: 'iconcreatetask_fill'},
{title: '文件', icon: 'iconmail_fill'}
],
},
events: ['recordStart', 'recordCancel', 'recordEnd', 'chooseExtrasItem', 'submit'],
}, function(){
})
//開始錄音
aui.chatbox.addEventListener({name: 'recordStart'}, function(ret){
console.log(ret);
//aui.toast({msg: ret.msg})
});
//取消錄音
aui.chatbox.addEventListener({name: 'recordCancel'}, function(ret){
console.log(ret);
//aui.toast({msg: ret.msg})
});
//結束錄音
aui.chatbox.addEventListener({name: 'recordEnd'}, function(ret){
console.log(ret);
aui.toast({msg: ret.msg})
});
//選擇附加功能
aui.chatbox.addEventListener({name: 'chooseExtrasItem'}, function(ret){
console.log(ret);
aui.toast({msg: ret.data.title});
});
//發送
aui.chatbox.addEventListener({name: 'submit'}, function(ret){
console.log(ret);
aui.toast({msg: ret.data.value})
});
````
