![e4b3a271bcde7ead58173b2553c83933.png](https://i-blog.csdnimg.cn/blog_migrate/e4a286a7babc31b642343203c4f4feed.png)
頔言頔语:进步,一定要进步,进步是跟收入持平的本钱。
总有人问:前端开发中是哪些轮子值得实现一遍。但是你造过那些轮子呢?这是我造过的!
声明:本项目所有的UI,来自于方应航,我只做简单修改!
输入框 · 轱辘 · 语雀www.yuque.com![715563c3cc38b6c01f7f1693a9718ee1.png](https://i-blog.csdnimg.cn/blog_migrate/b3bbfa1a8b8fb3fbaf2dad1564e018da.jpeg)
所有的项目按照流程按照一下目录进行
- 需求分析
- UI设计
- 项目代码
01需求分析
![d7390ab96aecf023f53da0f2a8659a68.png](https://i-blog.csdnimg.cn/blog_migrate/7bcd9fa520793ca03a668d60347d028d.jpeg)
02 UI设计
![aa183835107045724e2a0cfe18d8ba8c.png](https://i-blog.csdnimg.cn/blog_migrate/9ca54c1babb6a74bf217a10536a85546.jpeg)
03 项目代码
0301 创建Toast组件,并在APP中全局引入
0302 APP当中生成button,点击Button,Toast出现
<button @click= "showToast">点击显示toast</button>
当我点击button,调用自定义函数$toast 并且传递相关参数
showToast(){
this.$toast('我是message',
{
closeButton:{
text:'知道了',callBack(){
console.log('用户说他知道了')} },
position:'middle'},
)}
$toast函数是我们自定义的Vue插件
在main.js当中引入,并且使用
<