重構了cxlt-vue2-toastr插件

距離上篇文章已通過去一個多月了，期間有不少想法，但時間真不是想擠就能擠出來的。其實這段時間我就作了一件事，一個小程序的項目，已上線半月有餘，也迭代了幾個版本，如今還在不斷完善。

先說點題外話，咱們作了一個叫「車商聯盟」的小程序，目前只向車商開放，後面會逐漸向C端開放，之因此選擇小程序來實現，主要仍是便捷，方便傳播。前兩天看了「匿名聊聊」被封的新聞，還真是擔憂哪天被封了。小程序的開發不難，我從學習到上線第一個版本只用了兩個周（包括晚上加班），一邊學一邊開發。

---

迴歸正題。上次寫完cxlt-vue2-toastr插件，寫了一篇「學習vue 20天，我寫了點東西」的文章，有點標題黨的感受，還好反響不錯。當時寫完這個插件就意識到問題所在，提示插件怎麼還須要寫在template中呢，更友好的方式應是直接調用方法，另外同時只能顯示一個的問題，在這一版中也獲得瞭解決。從寫完上篇文章，就開始着手重構，隔幾天晚上抽時間改點，今天終於發佈了。

新的cxlt-vue2-toastr和以前的參數徹底一致，只是調用方式發生了變化。

 上一版本的用法： 

<cxlt-toastr :show="show" :toastr="toastr" @show-change="showChange"></cxlt-toastr>

show控制toastr的顯示/隱藏，toastr是一個對象，用於控制toastr顯示的標題、內容、位置等。

這一版的用法：

$toast.success({})
$toast.info({})
$toast.warn({})
$toast.error({})

根據不一樣場景調用不一樣的方法，方法需傳一個對象，包括標題、內容、位置等。

這種使用方式更天然，小程序中的提示也是這種形式 wx.showToast({})

下面附上：

github地址：https://github.com/chengxulvtu/cxlt-vue2-toastr

demo地址：https://chengxulvtu.github.io/toastr/index.html

 

若是對您有幫助，請「點贊」或關注「程序旅途」公衆號