Mint-UI的mt-search如何触发事件（确定和取消）

Mint-ui的官方文档写得是真的简单，简单到遗漏了许多重点，使用文档里关于mt-search的api只介绍了属性的部分，各个调用方法完全没有介绍，让用户自己去探索？官方文档。

关于开源框架的使用文档，我接触到的还是Element-UI写得最为简洁明了了，相比于Mint-UI都是同一个爸爸（饿了么）出来的，差距为什么就这么大呢？

正文

1、确定事件

mint-ui使用文档开头里有提到，在 Vue 2.0 中，为自定义组件绑定原生事件必须使用 .native 修饰符，mint-ui开发者可能考虑到button按钮使用的概率比较大，他们只对 Button 组件进行了处理，使用mt-button组件可以直接@click绑定事件，而其他的组件都需要使用.native修饰符来触发事件。

mt-search触发确定事件，需使用@keyup.enter.native来绑定确定事件，如下图：

<mt-search ref="mtSearch" @keyup.enter.native="search"></mt-search>

解释：很多读者会很纳闷，为什么不是用click点击事件触发呢？是这样子的，手机键盘的上都会自带有一个搜索按钮（右下角），无论是安卓还是ios，当用户输入完点击搜索按钮后就会执行所绑定的确定事件了。如下图问ios的键盘：

 2、取消事件

关于mt-search的取消事件就更蛋疼了，这个组件提供了一个取消按钮，却不提供点击触发事件，我也是佛了... 我在网上也搜了很久，没有找到一个很合适的，有的说监听input绑定的value为空时实现取消事件？这位小哥未必太单纯了，要是我输入时输错了或者想清空重新输入呢？这时候也会执行此取消事件。找了一遍，没找到，于是自己动手写一个吧。

请原谅，我用上了最原始的方法，哈哈哈哈哈... 

mounted(){
    this.$nextTick(()=>{
        let cancel = this.$refs.mtSearch.$el.querySelectorAll('.mint-searchbar-cancel')[0];
        cancel.onclick=()=>{
            this.close()    // 取消事件
        }
    })
}

给取消按钮添加一个dom事件，来执行取消事件，我也是无可奈何呀。

经过对各个移动端ui框架的对比，从技术团队、社区活跃度和框架实用性等方面考虑，我个人推荐有赞的Vant-ui，虽然Vant-ui初始定位是应用于商城类web，但是随着它的组件逐渐丰富，它可以应用于很多场景，最重要的是它的文档写得简洁明了，开发者用起来舒服；但它有一个缺点，单位用的是px，如果要做移动端适配还有把它转成rem，这一部分它文档有介绍，只不过转换有些麻烦。

（完）