更新记录

1.0.2（2022-07-23） 下载此版本

功能优化

1.0.1（2022-07-23） 下载此版本

优化已知问题

1.0.0（2022-07-22） 下载此版本

底部弹起的模态面板，包含与当前情境相关的多个选项

平台兼容性

uni-app

其他

actionSheet 动作面板

组件名：action-sheet 代码块： actionSheet 关联组件：uni-transition uni-transition

底部弹起的模态面板，包含与当前情境相关的多个选项。

<action-sheet ref="actionSheet" :actions='actions' cancel-text="取消" description="这是一段描述信息" @open="open" @close="close"></action-sheet>

import actionSheet from '@/components/uni-action-sheet/index.vue'
export default {
    components: {
        actionSheet
    },
    data() {
        return {
            actions: [{
                    name: '选项一',
                    color: 'red'
                },
                {
                    name: '选项二',
                    disabled: true
                },
                {
                    name: '选项三',
                    subname: '二级标题'
                }
            ]
        }
    },
    methods: {
        open() {
            console.log('动作面板打开');
        },
        close() {
            console.log('动作面板关闭');
        }
    }
}

打开面板

this.$refs.actionSheet.open()

关闭面板

this.$refs.actionSheet.close()

Props

Action 数据结构

actions 属性是一个由对象构成的数组，数组中的每个对象配置一列，对象可以包含以下值

Events