plus.nativeUI.actionSheet({
title: "标段选择",
cancel: "取消",
buttons: this.sectionselect
}
使用ActionSheet插件替代
https://ext.dcloud.net.cn/plugin?id=2638
解压下载的压缩包,将组件放在项目的components目录下
引用组件
<wyb-action-sheet ref="actionSheet" :options="options" @itemclick="onItemClick"/>
import wybActionSheet from '@/components/wyb-action-sheet/wyb-action-sheet.vue'
export default {
components: {
wybActionSheet
},
data() {
return {
// 这里的options有两种写法
// 简写形式:
options: ['红豆生南国', '春来发几枝', '愿君多采撷', '此物最相思'],
// 完整形式
options: [{
label: '红豆生南国', // 显示的文字
color: '#00a392', // 文字颜色
fontSize: '35px', // 文字大小
disabled: false // 是否禁用
}, {
label: '春来发几枝',
color: '#00a392',
fontSize: '',
disabled: false
}, {
label: '愿君多采撷',
color: '',
fontSize: '35px',
disabled: false
}, {
label: '此物最相思',
color: '',
fontSize: '',
disabled: true
}]
}
},
methods: {
onItemClick(e) {
let index = e.index
let label = e.label
uni.showToast({
title: JSON.stringify(e),
icon: 'none'
})
}
}
}
// onReady()生命周期之后调用
this.$refs.actionSheet.showActionSheet(); // 显示
this.$refs.actionSheet.hideActionSheet(); // 隐藏