一、前言
项目接近尾声,就想着做一个总结,期间遇到了很多问题,网上的帖子也是五花八门,有些东西根本没有说到点上,导致走了很多弯路,介于本人也只是一个萌新,总结仅供参考。
二、mintUI组件的使用
1、Tabbar
用到mintUI,肯定是移动端的项目了,不论是app还是h5都少不了这个底部导航,关于底部导航的,我在前面已经有所总结(https://www.cnblogs.com/yuxiaoge/p/11773524.html)
2、Cell
说到cell的使用我还真的是哭笑不得,也是折腾了一下,后来才发现问题的,我在使用vue脚手架搭建项目的时候发现左侧的问题并非居左,而是居中,为了这个问题,我还特意强制去设置它的样式,后来无意中注意到是在App.vue中的默认样式导致的,样式中有一个text-align:center把这个样式去掉就好了。
3、Action sheet
这个前面也有提到(https://www.cnblogs.com/yuxiaoge/p/11776802.html)
4、Message box
MessageBox('提示', '操作成功'); 关于这个组件官网是这样介绍的,可是对于新使用mintUI的码农来说,直接是使用不了的,下面就直接拿出我的代码吧。
messageBox(){
this.$messagebox('提示','操作成功!')
}
把这方法写在methods中,然后去调用它就可以了。传入对象的方法,也是如此,只需要修改括号的内容即可。
MessageBox.alert(message, title);这个方法同上,在
this.$messagebox后面跟上alert就可以了。
然后就是then的回调方法,这个也是重点
1 this.$messageBox.confirm('确定执行此操作?').then(action => {
2 console.log(action)//如果点是打印值confirm
3 if(action == 'confirm'){
4 console.log(111)//如果点是打印111
5 }
6 });
MessageBox.prompt(message, title);最后就是这个方法了,其实这个方法和上面是一样的,如出一辙。
this.$messagebox.prompt('请输入姓名?').then(({ value, action }) => {
console.log(action) //如果点击确认,依然打印的是confirm,也就是确认的意思
console.log(value) //value打印的是输入框中的值
});
后续继续补充,如有疑问,欢迎留言
博主QQ:1432208663
2019-11-15 11:36:09
来源:oschina
链接:https://my.oschina.net/u/4347889/blog/3346801