1、安装WEUI
cnpm install weui.js weui -S
2、引入WEUI
import weui from 'weui.js'
import 'weui'
Vue.prototype.$weui = weui
3、测试使用
具体调用的方法连接
https://github.com/Tencent/weui.js/blob/master/docs/README.md
测试环境,在vue方法中引入选择框组件
this.$weui.actionSheet([
{
label: '拍照',
onClick: function () {
console.log('拍照')
}
}, {
label: '从相册选择',
onClick: function () {
console.log('从相册选择')
}
}, {
label: '其他',
onClick: function () {
console.log('其他')
}
}
], [
{
label: '取消',
onClick: function () {
console.log('取消')
}
}
], {
className: 'custom-classname',
onClose: function(){
console.log('关闭')
}
});
效果
WEUI底部弹出选择框
完美兼容